@huyuchen/visual
Version:
## 组件环境
91 lines (90 loc) • 2.01 kB
JavaScript
import * as h from "echarts";
import d from "lodash.throttle";
import { reactive as f, watch as m, onMounted as _, nextTick as y, onBeforeUnmount as z, toRefs as c, openBlock as O, createElementBlock as v, normalizeStyle as B } from "vue";
import "./index.vue2.js";
import E from "../_virtual/_plugin-vue_export-helper.js";
const R = {
name: "HuBaseChart",
props: {
option: {
type: Object,
required: !0
},
theme: {
type: [Object, String],
default: ""
},
opts: {
type: Object,
default: () => ({
width: "auto",
height: "auto"
})
},
autoResize: {
type: Boolean,
default: !0
},
chartStyle: {
type: Object,
default: () => ({})
},
/* 注册插件 */
plugins: {
type: Array,
default: () => []
}
},
setup(r) {
const n = f({
// echartsInstance: null,
chartElRef: null
});
let t = { __resize: null };
m(
() => r.option,
(e) => {
s(), i(e);
},
{ deep: !0 }
), _(() => {
u(), r.autoResize && (o(), t.__resize = d(o, 200), addEventListener("resize", t.__resize)), y(() => {
o();
});
}), z(() => {
removeEventListener("resize", t.__resize);
});
const s = () => {
t && t.clear();
}, i = (e, a, p) => {
t && t.setOption(e, a, p);
}, o = (e) => {
t && t.resize(e);
}, l = (e) => {
t && t.dispatchAction(e);
}, u = () => {
const e = {
renderer: "canvas",
width: "auto",
height: "auto"
}, a = { ...r.opts, ...e };
t = h.init(n.chartElRef, r.theme, a), t.setOption(r.option);
};
return {
...c(n),
dispatchAction: l,
...c(r)
};
}
};
function x(r, n, t, s, i, o) {
return O(), v("div", {
ref: "chartElRef",
class: "sx-chart-wrapper",
style: B(t.chartStyle)
}, null, 4);
}
const S = /* @__PURE__ */ E(R, [["render", x]]);
export {
S as default
};