如何在echarts中按图例选项放大一个系列组。

Question

所以我在Reactjs项目中使用echarts(v4.6.0)库创建了一个条形图。它有图例，数据系列分块成组，具有相同的颜色和dataZoom滑块。每一个图例标签都对应着图中特定的条形组（它们具有相同的颜色）。然而此刻如果用户点击图例标签，与该标签对应的条形图就会消失。我想实现的是，当用户点击图例标签时，图表需要放大到与之对应的一组条形图，而不是隐藏它们。有什么办法可以做到这一点吗？

Answer 1

在通常的实践中，要使条形图选中你可以使用的是 emphasis它的风格设置是由鼠标移动激活的（类似于在规则声明下的 :hover 中的），例如（见 教程):

itemStyle: {
    // default styles
    normal: {
        shadowBlur: 200,
        shadowColor: 'rgba(0, 0, 0, 0.5)'
    }
    // activated by mouseover
    emphasis: {
        shadowBlur: 200,
        shadowColor: 'rgba(0, 0, 0, 0.8)'
    }
}

如果你只需要在焦点处显示条形图，这很容易。

1. 定义 emphasis 风格。
2. 捕捉事件 legendselectchanged 图例组件上，并抑制默认行为（见 变通办法)，以防止系列消失。
3. 调度 highlight action 系列或dataIndex和条形图将看起来像选定。

我可能是错的，但据我所知，要缩放单个（和堆叠）条形图并不是一件容易的事。有几种非常规的方法，比如在原始数据上绘制调整大小的条形图，用datazoom组件进行操作，在鼠标移动时重新计算更新条形图数据，然后在鼠标退出时返回旧数据。如果你选择了其中一种方法，请告诉我，我将尽力帮助你。