c3.js：如何隐藏特定数据集的点？答案

【问题标题】：c3.js : How to hide dots for specific data-set?c3.js：如何隐藏特定数据集的点？
【发布时间】：2017-04-19 05:07:53
【问题描述】：

假设我有两个数据集，data1 和 data2，但我想在 data2 上隐藏点/圆。我该怎么做？

var chart = c3.generate({
  data: {
      columns: [
          ['data1', 30, 200, 100, 400, 150, 250],
          ['data2', 50, 20, 10, 40, 15, 25]
      ]
  }

})

【问题讨论】：

一个类似的问题已经问过here，它应该可以解决你的问题。

标签： javascript charts c3.js

【解决方案1】：

使用 CSS 试试这个：来源 Here。 c3-circles-data2 和 c3-circles-data1 是 c3 为给定标签键（如 data1,data2）生成的类。

var chart = c3.generate({
  data: {
      columns: [
          ['data1', 30, 200, 100, 400, 150, 250],
          ['data2', 50, 20, 10, 40, 15, 25]
      ]
  }
})

#chart .c3-circles-data2 {
  display: none;
}

<link href="https://unpkg.com/c3@0.4.14/c3.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<script src="https://unpkg.com/c3@0.4.14/c3.js"></script>
<div class='chart'>
<div id='chart'></div>
</div>

注意：如果您想从两个系列中删除点，您可以添加

point: { show: false }

数据之后。

【讨论】：

谢谢.. 它有帮助。

【解决方案2】：

不是 js 解决方案，但对于所有点 c3 在包装器组元素上添加一个类作为 c3-circles-data1 c3-circles-data2 用于各个标签，您可以将其用于带有标签 data2 的数据，您可以在 css 中扩展它 display none如：

#chart  .c3-circles-data2{
  display:none
}

示例FIDDLE

【讨论】：

谢谢。解决了我的问题。