Questions tagged [c3]

C3.js is a Javascript library that uses D3.js to create reusable charts.

Site: http://c3js.org/

GitHub: https://github.com/masayuki0812/c3

129 questions
2
votes
1 answer

c3.js - c3 graph that has a tooltip with a c3 graph inside

I have a c3.js line graph that represents the evolution of 2 values. I need that the tooltip of the line graph to be a pie chart (tooltip = another c3.js graph). Here is what I succeeded: http://jsfiddle.net/owhxgaqm/80/ // c3 - custom…
Litra Eros
  • 21
  • 1
  • 3
2
votes
1 answer

c3js - D3js - Customize labels in a simple bar chart

Probably the best way to provide some context is showing the code: http://jsfiddle.net/ron_camaron/baa0q55j/12/ var arrayOfDates = ['Jun 2015', 'May 2015', 'Mar 2015', 'Feb 2015', 'Jan 2015', 'Dec 2014']; var arrayOfData = [7.25, 10.001, 10, 8.39,…
theRonny
  • 385
  • 5
  • 20
2
votes
2 answers

c3 js: How can I group by Year on the X-axis labels?

Using c3 js library for charts (c3js.org). I'am trying to achieve something similar to this chart (i.e., add year label 2011, 2012, 2013 on a seperate line after Q1, Q2, Q3, Q4) var chart = c3.generate({ data: { x: 'x', columns: [ …
user2075371
  • 107
  • 1
  • 7
2
votes
1 answer

Thickness of canvas axis line is increasing

I am converting svg(bar graph) to canvas using html5 canvas and then to image.But while converting the thickness of x-axis and y-axis line are increasing. this is my code var html = d3.select( '#div2 #' + $scope.selectedoption +…
Nithin A
  • 374
  • 1
  • 2
  • 18
2
votes
1 answer

Pubnub EON chart rendering multiple data in the chart

I am following the follwoing example to publish my data using pubnub and eon charts. When I publish just one data stream i.e 'checkpointsize' the chart renders fine but the minute I enter data2 i.e 'checkpointlength' it gives me error Uncaught…
Imo
  • 1,455
  • 4
  • 28
  • 53
2
votes
1 answer

How can i bind an json data with a key and Name for display

I have a situation to bind a json data with a key to plot a graph. But graph is plotting correctly but the name of the data is showing the same key. i need to avoid it . How can i supply a name for my data. I have tried as follows but its seems not…
kiran Gopal
  • 450
  • 5
  • 17
2
votes
2 answers

How to add labels to c3.js scatter plot graph?

Is it possible to add labels to scatter plot points in c3.js like in this google charts example? https://google-developers.appspot.com/chart/interactive/docs/gallery/bubblechart#javascript
Slimey
  • 25
  • 1
  • 3
2
votes
1 answer

C3.js - Changing colors of the circles in line charts

I am using C3.js to build a Line graph. In this graph I have to change the circle colors according to the array of colors. The code of c3 is below: var chart = c3.generate({ bindto:'#timeline', colors:['red',…
Vikram Singh Jadon
  • 1,007
  • 1
  • 10
  • 23
2
votes
1 answer

Gap between lines and axis with C3

How can I delete the space between the axis and the lines with C3 library ? I would like to achieve something like this: Tnx
Silvio S.
  • 547
  • 5
  • 20
2
votes
1 answer

Specifying "groups" dynamically in stacked bar chart c3js

//take this code as an example Here i have specified yvalue[0],yvalue[1] in groups.. But i need a general design ,where I dont know the number of groups that i have to create(i.e the number of segments) this varies according to the json…
Nithin A
  • 374
  • 1
  • 2
  • 18
2
votes
1 answer

passing multiple arrays to c3 graph

I have an api giving me back multiple arrays I have to place on a c3 line chart. I seem to be able to plot on just fine, but if I start to pass in multiples it starts having a fit. I've done some searching, but from what I've seen mine needs to be…
zazvorniki
  • 3,512
  • 21
  • 74
  • 122
2
votes
1 answer

How to remove axis line overflow in c3js line graph

If you take a look at those red circled areas, you can see that the axis is overflowing on the bottom left corner, and that there are axis ticks on the top of the Y axis and end of the X axis. The only custom CSS I have for the axis and the c3…
Shail Patel
  • 1,764
  • 5
  • 30
  • 46
2
votes
3 answers

How to remove cursor pointer from d3 Pie chart

Is there an option that disables the "cursor: pointer" style from the c3|d3 pie chart? I simply display slices and on hover just show the % percentage and a label, do not need the pointer because it is misunderstood as a link to somewhere, yet it is…
cnom
  • 3,071
  • 4
  • 30
  • 60
2
votes
2 answers

C3.js Change Circle Shape to Square

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…
BrandonReid
  • 1,264
  • 1
  • 13
  • 17
2
votes
1 answer

C3 area line graph with different colors for different sections

I'm using the C3 graph library to draw some graphs in my Javascript application. What I'm trying to accomplish is to draw various parts of my area line graph sections in different colors. Specifically what I want to achieve is that when my graph…
Luke
  • 20,878
  • 35
  • 119
  • 178
1 2
3
8 9