"use strict"; const common_vendor = require("../../common/vendor.js"); var chartList = {}; const _sfc_main = { // props: ["canvasId", "reference", "scoreList",'option'], props: { canvasId: { type: String, default: "echarts" }, option: { type: Object, default: () => { return {}; } } }, watch: { option: { immediate: true, handler(newValue, oldValue) { this.initChart(newValue); } } }, data() { return { ctx: null }; }, mounted() { echarts.registerPreprocessor((option) => { if (option && option.series) { if (option.series.length > 0) { option.series.forEach((series) => { series.progressive = 0; }); } else if (typeof option.series === "object") { option.series.progressive = 0; } } }); }, methods: { getCanvasAttr2d() { return new Promise((resolve, reject) => { const query = common_vendor.index.createSelectorQuery().in(this); query.select("#" + this.canvasId).fields({ node: true, size: true }).exec((res) => { const canvasNode = res[0].node; this.canvasNode = canvasNode; const canvasDpr = common_vendor.index.getSystemInfoSync().pixelRatio; const canvasWidth = res[0].width; const canvasHeight = res[0].height; this.ctx = canvasNode.getContext("2d"); const canvas = new WxCanvas(this.ctx, this.canvasId, true, canvasNode); echarts.setCanvasCreator(() => { return canvas; }); resolve({ canvas, canvasWidth, canvasHeight, canvasDpr }); }); }); }, getCanvasAttr() { return new Promise((resolve, reject) => { this.ctx = common_vendor.index.createCanvasContext(this.canvasId, this); var canvas = new WxCanvas(this.ctx, this.canvasId, false); echarts.setCanvasCreator(() => { return canvas; }); const canvasDpr = 1; var query = common_vendor.index.createSelectorQuery().in(this); query.select("#" + this.canvasId).boundingClientRect((res) => { const canvasWidth = res.width; const canvasHeight = res.height; resolve({ canvas, canvasWidth, canvasHeight, canvasDpr }); }).exec(); }); }, //绘制图表 async initChart(option) { const canvasAttr = await this.getCanvasAttr2d(); const { canvas, canvasWidth, canvasHeight, canvasDpr } = canvasAttr; chartList[this.canvasId] = echarts.init(canvas, null, { width: canvasWidth, height: canvasHeight, devicePixelRatio: canvasDpr // new }); canvas.setChart(chartList[this.canvasId]); chartList[this.canvasId].setOption(option ? option : this.option); }, //生成图片 canvasToTempFilePath(opt) { var query = common_vendor.index.createSelectorQuery().in(this); query.select("#" + this.canvasId).fields({ node: true, size: true }).exec((res) => { const canvasNode = res[0].node; opt.canvas = canvasNode; common_vendor.index.canvasToTempFilePath(opt, this); }); }, touchStart(e) { if (chartList[this.canvasId] && e.touches.length > 0) { var touch = e.touches[0]; var handler = chartList[this.canvasId].getZr().handler; handler.dispatch("mousedown", { zrX: touch.x, zrY: touch.y }); handler.dispatch("mousemove", { zrX: touch.x, zrY: touch.y }); handler.processGesture(wrapTouch(e), "start"); } }, touchMove(e) { if (chartList[this.canvasId] && e.touches.length > 0) { var touch = e.touches[0]; var handler = chartList[this.canvasId].getZr().handler; handler.dispatch("mousemove", { zrX: touch.x, zrY: touch.y }); handler.processGesture(wrapTouch(e), "change"); } }, touchEnd(e) { if (chartList[this.canvasId]) { const touch = e.changedTouches ? e.changedTouches[0] : {}; var handler = chartList[this.canvasId].getZr().handler; handler.dispatch("mouseup", { zrX: touch.x, zrY: touch.y }); handler.dispatch("click", { zrX: touch.x, zrY: touch.y }); handler.processGesture(wrapTouch(e), "end"); } } } }; function wrapTouch(event) { for (let i = 0; i < event.touches.length; ++i) { const touch = event.touches[i]; touch.offsetX = touch.x; touch.offsetY = touch.y; } return event; } function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) { return { a: $props.canvasId, b: $props.canvasId, c: common_vendor.o((...args) => $options.touchStart && $options.touchStart(...args)), d: common_vendor.o((...args) => $options.touchMove && $options.touchMove(...args)), e: common_vendor.o((...args) => $options.touchEnd && $options.touchEnd(...args)) }; } const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-ed5954d6"], ["__file", "E:/psy_web_share/components/echarts-uniapp/echarts-uniapp.vue"]]); tt.createComponent(Component);