@zhsz/cool-design-dv/lib/packages/chart/hooks/useMyChart.js

"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const util = require("../../../utils/util.js");
const log = require("../../../utils/log.js");
const vue = require("vue");
const echarts = require("echarts");
require("echarts/lib/component/tooltip");
require("echarts/lib/component/legend");
require("echarts/lib/component/title");
const resizeEvent = require("../../../utils/resize-event.js");
const extend = require("../utils/extend.js");
const dictionary = require("../../../utils/dictionary.js");
function _interopNamespaceDefault(e) {
  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
  if (e) {
    for (const k in e) {
      if (k !== "default") {
        const d = Object.getOwnPropertyDescriptor(e, k);
        Object.defineProperty(n, k, d.get ? d : {
          enumerable: true,
          get: () => e[k]
        });
      }
    }
  }
  n.default = e;
  return Object.freeze(n);
}
const echarts__namespace = /* @__PURE__ */ _interopNamespaceDefault(echarts);
function useMyChart(props, instance, $listeners, $emit, adapter) {
  const coordinates = vue.ref(/* @__PURE__ */ Object.create(null));
  const proxyResize = vue.ref(util.debounce(resize, 50));
  const proxySetOption = vue.ref(util.debounce(setOption, 50));
  const chart = vue.ref();
  const _uid = util.uid();
  const classes = vue.computed(() => {
    return {
      [`my-chart-${_uid}`]: true,
      "my-chart": true
    };
  });
  const styles = vue.computed(() => {
    return {
      width: props.fit ? "100%" : props.width,
      height: props.fit ? "100%" : props.height
    };
  });
  function init() {
    chart.value = vue.markRaw(echarts__namespace.init(instance.$el, props.theme));
    Object.entries($listeners).forEach(([name, handler]) => {
      chart.value.on(name, handler);
    });
    props.loading && chart.value.showLoading();
    proxySetOption.value();
    resizeEvent.addResizeListener(instance.$el, proxyResize.value);
  }
  function nativeSetOption(option) {
    if (props.debug) {
      log.tip("chart", _uid);
      log.log(option);
      log.log("----------");
    }
    chart.value.setOption(option);
  }
  function setOption() {
    if (!chart.value)
      return;
    if (props.options) {
      nativeSetOption(props.options);
      return;
    }
    const options = adapter ? adapter(props) : {};
    if (props.extend) {
      extend.default(
        options,
        typeof props.extend === "function" ? props.extend(options) : props.extend
      );
    }
    nativeSetOption(options || {});
  }
  function dispose() {
    if (!chart.value)
      return;
    Object.entries($listeners).forEach(([name, handler]) => {
      chart.value.off(name, handler);
    });
    chart.value.dispose();
    chart.value = null;
    resizeEvent.removeResizeListener(instance.$el, proxyResize.value);
  }
  function resize() {
    if (!chart.value)
      return;
    chart.value.resize();
  }
  function recordCoords(geo) {
    if (!geo || !geo.features)
      return;
    geo.features.forEach((feat) => {
      const properties = feat.properties;
      if (properties.cp) {
        coordinates.value[properties.name] = properties.cp;
      }
    });
  }
  function registerMap() {
    const { register, map } = props;
    if (!register || !map)
      return Promise.resolve();
    const registerGeo = echarts__namespace.getMap(map);
    if (registerGeo) {
      recordCoords(registerGeo.geoJson);
      return Promise.resolve();
    }
    if (typeof register === "function") {
      return props.register().then((geo) => {
        echarts__namespace.registerMap(map, geo);
        recordCoords(geo);
        props.onRegister && props.onRegister(map, geo);
        $emit("register", map, geo);
        return geo;
      });
    } else {
      echarts__namespace.registerMap(map, register);
      recordCoords(register);
      props.onRegister && props.onRegister(map, register);
      return Promise.resolve();
    }
  }
  vue.watch(
    [
      () => props.options,
      () => props.extend,
      () => props.settings,
      () => props.data
    ],
    () => {
      vue.nextTick(proxySetOption.value);
    }
  );
  vue.watch(
    () => props.loading,
    (val) => {
      if (!chart.value) {
        return;
      }
      if (val) {
        chart.value.showLoading();
      } else {
        chart.value.hideLoading();
      }
    }
  );
  vue.watch(
    () => props.coords,
    (val) => {
      const coords = Array.isArray(val) ? dictionary.arrayToMap(val) : val;
      coordinates.value = Object.assign(coordinates.value, coords);
    }
  );
  return {
    classes,
    styles,
    registerMap,
    init,
    dispose
  };
}
exports.default = useMyChart;