2

Using c3.js, wondering if there's any way to change the circles on a scatter plot to something else, like a rectangle? Maybe some sort of d3 script..

Would like to use shape to differentiate between two forms of data (locations & competitors).

Any help would be much appreciated!

BrandonReid
  • 1,264
  • 1
  • 13
  • 17
  • So to be clear you're trying to square a circle :) From the source and inspecting the graphs it appears the 'circle' is hard coded in quite a few places and would be pretty hard to change. With regard to charts if you really need tight control would suggest just doing it yourself with a directive and SVG (D3 if you find that useful). Recently build a line chart and bar chart components using pure SVG and it turns out simpler to change things. – shaunhusain Apr 22 '15 at 21:39
  • you can review the answer in this post, http://stackoverflow.com/questions/17437408/how-do-i-change-a-circle-to-a-square-using-d3 – carlos a. Apr 22 '15 at 21:40
  • Appreciate it guys! As the answer below mentions, circles are pretty hard coded, so yeah, having to swap them after render. – BrandonReid Apr 23 '15 at 17:52

2 Answers2

3

I do not believe it is currently possible, but you may want to keep on eye on/contribute to this github issue, where that feature has been requested: https://github.com/masayuki0812/c3/issues/1071

James Henry
  • 844
  • 6
  • 12
1

Workarond for square in css. It is not the best way but ...

circle {
    stroke: rgb(255, 127, 14); 
    stroke-linecap: square; 
    stroke-dasharray: 0.1 60; 
    stroke-width: 14px;
}
Lola
  • 2,591
  • 6
  • 24
  • 49