Closed codinglilong closed 5 years ago
import React from 'react' import ReactEcharts from 'echarts-for-react'; export default class EChartsDemo extends React.Component { constructor(props) { super(props); this.chart = null } onChartReadyCallback = (chart) => { // console.log(chart) //这种方法也是失败的 //chart.dispatchAction({type: 'highlight',seriesIndex: 0,dataIndex: 0}); } onChartClick = (e) => { console.log(e) this.chart.dispatchAction({ type: 'downplay', seriesIndex: 1, dataIndex: 2 }) this.chart.dispatchAction({ type: 'highlight', seriesIndex: e.seriesIndex, dataIndex: e.dataIndex }); } componentDidMount() { // console.log(this.chart) //这种方法也是失败的 this.chart.dispatchAction({ type: 'highlight', seriesIndex: 1, dataIndex: 2 }); } render() { const options = { tooltip: { trigger: 'item', formatter: "{a} <br/>{b}: {c} ({d}%)" }, legend: { orient: 'vertical', x: 'left', data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎'] }, series: [ { name: '访问来源', type: 'pie', radius: ['50%', '70%'], avoidLabelOverlap: false, label: { normal: { show: false, position: 'center' }, emphasis: { show: true, textStyle: { fontSize: '30', fontWeight: 'bold' } } }, labelLine: { normal: { show: false } }, data: [ { value: 335, name: '直接访问' }, { value: 310, name: '邮件营销' }, { value: 234, name: '联盟广告' }, { value: 135, name: '视频广告' }, { value: 1548, name: '搜索引擎' } ] } ] }; return ( <ReactEcharts option={options} ref={(e) => { this.chart = e.getEchartsInstance() }} onChartReady={this.onChartReadyCallback} onEvents={{ click: this.onChartClick, }} /> ) } }`
不管我怎么设置为什么不能做到打开页面默认饼图高亮一块地方。每次进入页面高亮凸起一块就一闪而过。不能停留。这是为什么呀?难道我用的不对吗?
请问解决了吗,我也遇到了
好吧,设置一个定时器,应该是叠加渲染出现问题了,初始化之后覆盖了。。
不管我怎么设置为什么不能做到打开页面默认饼图高亮一块地方。每次进入页面高亮凸起一块就一闪而过。不能停留。这是为什么呀?难道我用的不对吗?