c3.js - 如何在条形图悬停时显示手形光标答案

【问题标题】：c3.js - how to show hand cursor on bar chart hoverc3.js - 如何在条形图悬停时显示手形光标
【发布时间】：2015-12-19 05:10:55
【问题描述】：

在饼图中，c3js 默认在饼图悬停时显示手形光标（指针）。我希望条形图中的每个条都具有相同的行为。如何实现？

我尝试了下面的 css，但即使您将鼠标悬停在 2 个小节之间，它也会显示手形光标。

.c3-event-rect {
    cursor:pointer;
}

澄清这是jsfiddle example 我希望指针光标只放在条形项目上，因为只有它们是可点击的。

【问题讨论】：

【解决方案1】：

花了太多时间，我终于想出了一个的解决方案。 Here is a jsfiddle，详细解释了这两行代码（以 cmets 为单位）。

如果您不了解详细信息，请不要担心或请我详细说明。 :)

tl;dr：

【讨论】：

【解决方案2】：

只需使用以下 CSS

.c3-bar {
    pointer-events: auto !important;
}

请注意，您需要 !important 覆盖 C3 添加到条形图的内联 pointer-events: none。

【讨论】：

谢谢。它使用指针光标来解决问题，但另一方面，此解决方案会阻止栏上的 onclick 事件。你可以在jsfiddle.net/7L53LLr0/6查看
@MarkZ ，至少在我的浏览器上，它不会阻止 onclick 事件。你能描述一下你希望发生的事件到底是什么（onclick）吗？
正如您在原始版本 (jsfiddle.net/7L53LLr0/7) 上看到的那样，单击条形图会弹出带有值消息的警报。这个版本是不需要的，因为当你悬停一个栏时光标是正常的。带有您的 css 修复 (jsfiddle.net/7L53LLr0/6) 的版本使光标成为所需的手，但在单击栏后没有任何反应。我在 Chrome、IE 11 和 Firefox 上对其进行了测试。在所有这些上，行为都是相同的。