ECharts 联动效果
生活随笔
收集整理的這篇文章主要介紹了
ECharts 联动效果
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
在使用ECharts 時候要用到聯(lián)動的，比如下面的示例圖，當(dāng)鼠標(biāo)經(jīng)過A的圖的時候，這個時候有提示，然后讓B的提示也顯示出來。這樣一個效果。
官方文檔給的配置項(xiàng)，?http://echarts.baidu.com/api.html#echarts.connect
var myChart1 = echarts.init(document.getElementById('main1'));var myChart2 = echarts.init(document.getElementById('main2'));var option = {title: {text: 'ECharts 入門示例'},tooltip: {trigger: 'axis'},toolbox: {show : true,feature : {mark : {show: true},dataView : {show: true, readOnly: false},magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},restore : {show: true},saveAsImage : {show: true}}},legend: {data:['銷量']},xAxis: {data: ["襯衫","羊毛衫","雪紡衫","褲子","高跟鞋","襪子"]},yAxis: {},series: [{name: '銷量',type: 'line',data: [5, 20, 36, 10, 10, 20]}]};myChart1.setOption(option);myChart2.setOption(option);// 控制聯(lián)動的myChart1.connect([myChart2]);myChart2.connect([myChart1]);
總結(jié)
以上是生活随笔為你收集整理的ECharts 联动效果的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Bamboolib -- 十分钟教会业务
- 下一篇： “数字强市 数创未来” | 山东省数据应