javascript/vueecharts
1
0
Fork 0
mirror of https://github.com/ecomfe/vue-echarts.git synced 2025-11-08 05:55:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add default style, injectable update-options & loading-options

Browse Source
This commit is contained in:
Justineo
2021-02-22 11:50:43 +08:00
parent aaab149c11
commit b8d9ca7991
7 changed files with 98 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/composables/api.ts
View File

@ -1,6 +1,6 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
import { Ref } from "vue-demi";
import { EChartsType, OptionType } from "../types";
import { EChartsType, Option } from "../types";
const METHOD_NAMES = [
"getWidth",
@ -24,7 +24,7 @@ type PublicMethods = Pick<EChartsType, MethodName>;
export function usePublicAPI(
chart: Ref<EChartsType | undefined>,
init: (option?: OptionType) => void
init: (option?: Option) => void
) {
function makePublicMethod<T extends MethodName>(
name: T

4
src/composables/autoresize.ts
View File

@ -1,13 +1,13 @@
import { Ref, watch } from "vue-demi";
import { throttle } from "echarts/core";
import { addListener, removeListener, ResizeCallback } from "resize-detector";
import { EChartsType, OptionType } from "../types";
import { EChartsType, Option } from "../types";
export function useAutoresize(
chart: Ref<EChartsType | undefined>,
autoresize: Ref<boolean>,
root: Ref<HTMLElement | undefined>,
option: Ref<OptionType>
option: Ref<Option>
): void {
let resizeListener: ResizeCallback | null = null;
let lastArea = 0;

12
src/composables/loading.ts
View File

@ -1,11 +1,19 @@
import { Ref, watchEffect } from "vue-demi";
import { inject, computed, Ref, watchEffect } from "vue-demi";
import { EChartsType } from "../types";
export const LOADING_OPTIONS_KEY = "ecLoadingOptions";
export function useLoading(
chart: Ref<EChartsType | undefined>,
loading: Ref<boolean>,
loadingOptions?: Ref<object | undefined>
): void {
const defaultLoadingOptions = inject(LOADING_OPTIONS_KEY, {}) as object;
const realLoadingOptions = computed(() => ({
...defaultLoadingOptions,
...loadingOptions?.value
}));
watchEffect(() => {
const instance = chart.value;
if (!instance) {
@ -13,7 +21,7 @@ export function useLoading(
}
if (loading.value) {
instance.showLoading(loadingOptions?.value);
instance.showLoading(realLoadingOptions.value);
} else {
instance.hideLoading();
}