C3: 点的自定义形状

创建于 2015-03-20  ·  47评论  ·  资料来源: c3js/c3

能够为图形点定义不同的形状(圆形、方形、三角形、星形……)会很棒。

他们有两个主要原因:

  • 在灰度打印机上打印
  • 色盲的人

谷歌组上创建了一些主题而没有回应:
https://groups.google.com/d/topic/c3js/I2UhY4U6zI0/discussion
https://groups.google.com/d/topic/c3js/gZrpl0QpKYw/discussion
https://groups.google.com/d/topic/c3js/6QRQ1VWx3vw/discussion

图例应使用与点定义相同的形状。

这是我想象的配置:

point: {
  shape: {
    'data1': 'circle',
    'data2': 'square',
    'data3': 'triangle'
  }
}

或者,为了定义其他一些自定义属性:

point: {
  'data1': {
    shape: 'circle',
    color: '#ff0000',
    r: 2
  },
  'data2': {
    shape: 'square',
    color: '#0000ff',
    r: 3
  }
}
C-feature-request R-needs-docs

最有用的评论

每个想要此功能的人,请自行订阅或使用表情符号回复而不是回复 +1。

谢谢。

所有47条评论

我真的很感激这个功能。

+1

主要 +1

+1

+1
有没有人找到实现这一目标的方法?

我致力于为绘图点实现自定义形状。 我已经实现了正方形和矩形形状。
这是我的工作:
https://github.com/prakulgupta/c3.js-CustomPlotPointShapes-Feature.git

希望这可以帮助需要自定义形状功能的人:+1:

谢谢@prakulgupta
为了实现不同的形状,我必须在图表构建后运行 d3 函数,将圆圈直接更改为正方形。让我感到恶心。 我的计划是用直接 d3 重建我们的散点图。 将尝试该回购!

+1 也希望看到这一点。

+1 急需

+1 会很棒!

@prakulgupta这看起来是一个非常好的拉取请求候选人! 你会考虑这样做吗? 谢谢!

我想要一个三角形 :( 或箭头标记。在条形图中显示点。

+1

+1

👍

我找到了解决方案。 使用 d3。 这比你想象的要容易得多。 例如: http ://bl.ocks.org/bunkat/2595950

我会说这不是一个真正的解决方案。
我们正在使用 c3 提供的一系列函数。 使用本机 d3 库重写它们不是很有用。

+1,为图例提供点类型也很棒

+1!

+1

👍

+1

每个想要此功能的人,请自行订阅或使用表情符号回复而不是回复 +1。

谢谢。

在这两种显示图形之间切换模式之类的东西会很整洁。

你可以使用像https://github.com/d3/d3-shape#symbols这样的东西来完成这个吗?

有关散点图的另一种解决方案,请参见此处: http ://stackoverflow.com/a/41848255/1178015

+1

👍

👍

+1

+1

此问题/请求的状态如何? 这确实是唯一阻止我使用 C3js 的事情,我很乐意这样做。 A11y 是个大问题,关于印刷和色盲的观点是有效的。 去年我竖起了大拇指,但就解决方案而言,该线程已变得沉默。 这是目前正在开发的东西,还是这个请求被拒绝了?

感谢所有出色的工作,并希望解决方案是可能的。

如果它允许的不仅仅是符号,例如图像或 svg,它也会很有用。
例如,基于某些属性突出显示某些数据集会非常简洁。

如果它可以允许将特定形状设置到数据集的特定点,那就更棒了。
示例应用:在风速图上(x 为日期,y 为速度),它将允许在每个值上显示风向(方向箭头为点形状)。

+1

👍

👍

请对您喜欢的评论进行投票,而不是评论 +1 或竖起大拇指,通过不向任何人的收件箱发送垃圾邮件并仅发送有关相关输入的消息,可以更轻松地关注问题

👍

👍

👍

👍

对 c3 代码库有更深入了解的人可以评论如何实现这一更改吗? 有了这样的指导,也许社区中的某个人会自愿承担这项任务。

使用 highcharts... 更好: https ://www.highcharts.com/blog/products/highcharts/

在这方面有什么进展吗? 在撰写本文时,这是近 4 年的问题。

@BrandKNY这个项目不再维护。 billboard.js 是新的活动分支,但此功能在 billboard.js 中也没有准备好

这个问题是旧的/2015 年!但 https://c3js.org/reference.html 不存在点样式)

也许第一步是包括一点增强而不是大跳跃到“任何形状”......建议:如data.colors每个数据集的定义,提供将圆半径定义为对象的选项,

 point: { 
    r: { data1: 5,   data2: 2.5 } 
} 
此页面是否有帮助?
0 / 5 - 0 等级