有什么方法可以在鼠标悬停时更改 c3js 堆积面积图不透明度

Question

我有一个关于 c3.js 的问题。目前，我们正在使用 c3js 来显示堆叠面积图，这很好，但是我们的客户问我们是否可以在客户将鼠标悬停在一个区域时更改单个区域的不透明度。我找不到任何解决方案，希望听到您的建议。谢谢

Answer 1

在设置图表后尝试添加它 -->

d3.selectAll(".c3-area")
    .style ("pointer-events", "all")
    .on("mouseover", function (d) { return d3.select(this).style("opacity", 0.6)})
    .on("mouseout", function (d) { return d3.select(this).style("opacity", 0.2)})
;

指针事件设置很重要，因为默认情况下，c3 图表中的大多数元素都被设置为忽略它们。

将它添加到 c3 示例的末尾以查看它是否正常工作 --> https://c3js.org/samples/chart_area.html

有什么方法可以在鼠标悬停时更改 c3js 堆积面积图不透明度

are there any way to change c3js stacked area chart opacity on mouse hover

d3.js

c3.js