JAVASCRIPT
VUE
REACT
NODE
ES6
TYPESCRIPT

Echarts多个图表实现联动

2019. 10. 16    

Echarts多个图表实现联动

基础Demo

// 基于准备好的dom,初始化echarts实例
var myChart1 = echarts.init(document.getElementById('main'));
var myChart2 = echarts.init(document.getElementById('main2'));

// 指定图表的配置项和数据
var option1 = {...}
var option2 = {...}

// 为echarts对象加载数据
myChart1.setOption(option1);
myChart2.setOption(option2); 

//联动配置

方法一:

// 分别设置每个实例的 group id
myChart1.group = 'group';
myChart2.group = 'group';
echarts.connect('group');

方法二:

// 可以直接传入需要联动的实例数
echarts.connect([myChart1,myChart2]);

echart多图表实现联动