唐
唐俊啊
@唐俊啊
0
声望
5
帖子
1138
资料浏览
0
粉丝
1
关注
唐俊啊 发布的帖子
-
RE: 升级taro3之后echarts失效
@HTTISHERE你好 使用你的代码initChart方法没有执行
import Taro from "@tarojs/taro"; import React, { Component } from "react"; import { View } from "@tarojs/components"; import * as echarts from "../ec-canvas/echarts.js"; let chart = null; function setChartData(chart, data) { let option = { title: { textStyle: { color: "#eee", size: 12, rich: {} } }, grid: { x: 20, y: 20, x2: 20, y2: 20, top: 20, bottom: 20, left: 20, right: 20, containLabel: true }, radar: { indicator: data, name: { textStyle: { color: "#333333", fontSize: 10, backgroundColor: "rgba(255,216,1,0.4)", padding: [0, 5], borderRadius: 50, lineHeight: 20, rich: {} } }, // splitNumber: 8, splitLine: { lineStyle: { color: [ "rgba(255, 216, 1, 1)", "rgba(255, 216, 1, 1)", "rgba(255, 216, 1, 1)", "rgba(255, 216, 1, 1)", "rgba(255, 216, 1, 1)", "rgba(255, 216, 1, 1)" ].reverse() } }, splitArea: { show: false, areaStyle: { color: [ "rgba(255, 216, 1, 0.1)", "rgba(255, 216, 1, 0.2)", "rgba(255, 216, 1, 0.3)", "rgba(255, 216, 1, 0.4)", "rgba(255, 216, 1, 0.6)", "rgba(255, 216, 1, 0.8)" ].reverse() // 图表背景网格的颜色 } }, axisLine: { lineStyle: { color: "#FFD801" } } }, series: [] }; if (data && data.dimensions && data.measures) { option.radar.indicator = data.dimensions.data; option.series = data.measures.map(item => { return { ...item, type: "radar" }; }); } console.log('option',option) chart.setOption(option); } function initChart(canvas, width, height) { console.log("init"); chart = echarts.init(canvas, null, { width: width, height: height }); canvas.setChart(chart); setChartData(chart, {}); return chart; } export default class RadarChar extends Component { constructor(props) { super(props); } state = { ec: { onInit: initChart }, init_chart: false }; componentDidUpdate(nextProps) { const _this = this; setTimeout(() => { setChartData(chart, nextProps.chartData) }, 2000); } refChart = React.createRef(); render() { return ( <ec-canvas ref={this.refChart} id="mychart-dom-area" canvas-id="mychart-area" ec={this.state.ec} /> ); } }