如何在c3js中设置样式折线图点

Posted 2023-02-22

【中文标题】如何在c3js中设置样式折线图点

【英文标题】：how to style style line chart points in c3js

【发布时间】：2015-07-26 16:54:22

【问题描述】：

我有一个一般性的 c3js 问题。我正在尝试将 C3JS 折线图中的点设为“空心”（白色填充，带有彩色笔划），但我很难弄清楚如何做到这一点。我尝试添加自己的 CSS，但它被 html 中的直接 style 标记覆盖。

有人有什么建议吗？

谢谢！

【问题讨论】：

你能贴出与这些点相关的代码吗？

您是否尝试过在 CSS 中使用 !important 使其优先于 c3.js 中的 CSS 样式？

【参考方案1】：

或者您可以简单地使用 .c3-circle 类，如下所示：

.c3-circle 
    stroke-width: 2px;
    stroke: #fff;

【参考方案2】：

您可能需要深入了解 D3 代码才能在 svg 上操作它们，如下所示：

d3.selectAll("circle")
  .attr("r", 10)
  .style("fill", "white")
  .style("stroke", "black")
  .style("stroke-width", 5);