交互联动
脚本宝典收集整理的这篇文章主要介绍了交互联动，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。
多个图表共同使用一个dataset
<!DOCTYPE htML><html><head> <;meta charset="utf-8"> <tITle>ECharts 实例</title> <!-- 引入 echarts.js --> <script src="https://cdn.statiCFile.org/echarts/4.3.0/echarts.min.js"></script></head><body> <!-- 为ECharts准备一个具备大小（宽高）的Dom --> <div id="main" style="width: 600px;height:400px;"></div> <script type="text/javascript"> // 基于准备好的dom，初始化echarts实例 VAR myChart = echarts.init(document.getElementById('main')); setTimeout(function () {
option = { legend: {}, tooltip: { trigger: 'axis', showContent: false }, dataset: { source: [ ['PRoduct', '2012', '2013', '2014', '2015', '2016', '2017'], ['Matcha Latte', 41.1, 30.4, 65.1, 53.3, 83.8, 98.7], ['Milk Tea', 86.5, 92.1, 85.7, 83.1, 73.4, 55.1], ['Cheese Cocoa', 24.1, 67.2, 79.5, 86.4, 65.2, 82.5], ['Walnut brownie', 55.2, 67.1, 69.2, 72.4, 53.9, 39.1] ] }, xAxis: {type: 'category'}, yAxis: {gridIndex: 0}, grid: {top: '55%'}, series: [ {type: 'line', smooth: true, seriesLayoutBy: 'row'}, {type: 'line', smooth: true, seriesLayoutBy: 'row'}, {type: 'line', smooth: true, seriesLayoutBy: 'row'}, {type: 'line', smooth: true, seriesLayoutBy: 'row'}, { type: 'pie', id: 'pie', radius: '30%', center: ['50%', '25%'], label: { formatter: '{b}: {@2012} ({d}%)' }, encode: { itemName: 'product', value: '2012', tooltip: '2012' } } ] };
myChart.on('updateAxisPointer', function (event) { var xAxisInfo = event.axesInfo[0]; if (xAxisInfo) { var dimension = xAxisInfo.value + 1; myChart.setOption({ series: { id: 'pie', label: { formatter: '{b}: {@[' + dimension + ']} ({d}%)' }, encode: { value: dimension, tooltip: dimension } } }); } });
myChart.setOption(option);
}); </script></body></html>
脚本宝典总结
以上是脚本宝典为你收集整理的交互联动全部内容，希望文章能够帮你解决交互联动所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。
- clion结合vcpkg以及GTest的使用 2022-07-07
- EGF 2022-06-06
- ExtJS 布局-Column布局（Column layout） 2022-06-05
- 颜色之ARGB与RGB、RGBA的区别与介绍 2022-04-15
- rgba中的a是什么意思 CSS之RGBA颜色指南 2022-04-15
- rootfs -根文件系统制作 2022-07-07
- 网页简单布局之结构与表现原则分享 2022-04-15
- 小项目中怎么防止Vue的闪现画面效果 2022-04-15
- 隐藏 Web 中的元素方法及优缺点教程详解 2022-04-15
- 告别硬编码让你的前端表格自动计算的实例代码 2022-04-15