Echarts能否实现图例联动

ECharts 是一个使用 JavaScript 实现的开源可视化库，可以用于生成各种图表。关于图例联动，ECharts 提供了联动功能，可以实现多个图表之间的交互。以下是一个简单的示例：

首先，确保你已经在页面中引入了 ECharts 的库文件：

<script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.2.2/echarts.min.js"></script>

然后，创建两个图表实例，并在它们的配置项中设置 legend 和 series：

<div id="chart1" style="width: 600px; height: 400px;"></div>
<div id="chart2" style="width: 600px; height: 400px;"></div>

接下来，编写 JavaScript 代码来初始化这两个图表，并设置它们的配置项：

var chart1 = echarts.init(document.getElementById('chart1'));
var chart2 = echarts.init(document.getElementById('chart2'));

var option1 = {
    legend: {
        data: ['A', 'B', 'C']
    },
    series: [
        { name: 'A', type: 'bar', data: [10, 20, 30] },
        { name: 'B', type: 'bar', data: [20, 30, 40] },
        { name: 'C', type: 'bar', data: [30, 40, 50] }
    ]
};

var option2 = {
    legend: {
        data: ['A', 'B', 'C']
    },
    series: [
        { name: 'A', type: 'line', data: [10, 20, 30] },
        { name: 'B', type: 'line', data: [20, 30, 40] },
        { name: 'C', type: 'line', data: [30, 40, 50] }
    ]
};

chart1.setOption(option1);
chart2.setOption(option2);

最后，设置图表的联动功能：

echarts.connect([chart1, chart2]);

现在，当你在一个图表中点击图例时，另一个图表中的相应图例也会被选中或取消选中。这就实现了图例联动功能。你可以根据需要调整图表的类型、数据和样式。更多关于 ECharts 的信息和示例，请参考官方文档：https://echarts.apache.org/zh/index.html