Stack Overflow
Stack Overflow

Questions tagged [c3.js]

c3 is a D3-based reusable chart library that enables deeper integration of charts into web applications.

c3 is a D3-based reusable chart library that enables deeper integration of charts into web applications.

D3.js is a JavaScript library for manipulating documents based on data.

  • Easy to generate D3-based charts by wrapping the code required to construct the entire chart. Don't need to write D3 code
  • C3 gives some classes to each element when generating, so you can define a custom style by the class
  • C3 provides a variety of APIs and callbacks to access the state of the chart. By using them, you can update the chart even if after it's rendered.

Links

Related tags

1125 questions
30
votes
3 answers

C3JS - Cannot read property 'category10' of undefined

I tried this c3.js code from jsfiddle (https://jsfiddle.net/varunoberoi/mcd6ucge) but it doesn't seem to work in my localhost. I'm using uniserver as my server. I copy-paste everything but it's not working. …
JJC
  • 373
  • 1
  • 5
  • 10
23
votes
8 answers

How to change tooltip content in c3js

I'm working on a timeline display and I have data that I want to show on the tooltip. currently it only shows the value at each time. and I cannot find a way to change it. the example below shows how to change the value's format but not what values…
Adi
  • 381
  • 2
  • 3
  • 10
21
votes
1 answer

How add C3 charts to angular 2+ project

I searched a lot about Angular2 chart packages but there was no name of C3.js till I found an example of C3.js charts in link below ani-angular.strapui.com/dashboard/charts/c3-chart Then I searched for "C3 charts for angular" founded results was all…
Vala Khosravi
  • 1,975
  • 3
  • 14
  • 41
20
votes
1 answer

Show color thresholds in c3.js gauge

I'm trying to configure a c3gauge chart but I would like to show the threshold values in the chart (outside labels with the color would be nice) just to realize how far the value is from the next level. Any one can help me? This is the gauge…
user1948455
  • 201
  • 1
  • 4
18
votes
4 answers

How can I add a title to c3.js chart

Can any one suggest me the way of adding title to the C3.js line and bar charts ? I have got the following sample but it is for gauge chart. For any c3 chart is there any option to set the chart title? donut: { title: 'Title' }
smart987
  • 782
  • 2
  • 11
  • 31
14
votes
2 answers

C3.js - Timeseries with time fails to parse

I want to display a time series chart with C3.js using a date in the format 2015-09-17 18:20:34 and the format string '%Y-%m-%d %H:%M:%S' but it fails to parse. My code: var chart = c3.generate({ bindto: '#chart', data: { x: 'times', …
das Keks
  • 2,933
  • 3
  • 27
  • 48
12
votes
1 answer

C3JS bar chart with specific order

If I have a C3JS grouped bar chart defined like the following, how can I get the segments to stay in the order I've defined them instead of in ascending order by value? By default C3 will order them as 5, 10, 40, but I want it to remain as 10, 40,…
Patrick Grimard
  • 6,599
  • 6
  • 43
  • 63
12
votes
1 answer

c3js position of data labels

Is there any possible way to change a positions of labels above the data in c3 bar chart? In official documentation there is well explained how to change positions of labels on x and y measurement axis with manipulation of y and x integer, but I did…
dzordz
  • 2,127
  • 12
  • 48
  • 73
11
votes
1 answer

How to show c3.js No data but with legend for empty column?

I have managed to display "No data available message" on my chart. But trouble is that I want to show legend with data name even when there is no data. If the values are null, the "No data" message will disappear. If there is no data, message will…
Radovan Skendzic
  • 2,688
  • 1
  • 9
  • 20
11
votes
1 answer

C3.js - How to specify the timestamp format when plotting timeseries taken from InfluxDB

influxDB timestamps look like this: 2015-01-29T21:55:43.702900257Z The question is what options should I use for the x-axis when I generate the graph with C3.js The error I get: "Failed to parse x '2015-01-29T21:55:43.702900257Z' to Date…
tgogos
  • 16,343
  • 14
  • 77
  • 108
11
votes
7 answers

c3js: Is there a way to change font size?

Can I enlarge the font of c3js charts, such as in axis labels, data labels or categories? I'm interested in setting the general-case font to a larger one. I searched the docs and couldn't find anything that related to "font" in any way.
Kludge
  • 2,305
  • 4
  • 18
  • 35
11
votes
4 answers

c3js › Timeseries x values not evenly spaced

I am having an issue with the labels assigned to the values of my graph. The graph is a timeseries. I add values using the 'columns' property of c3js. I use pure timestamps (in seconds) and then convert them into strings using the label.format.…
2dvisio
  • 811
  • 2
  • 9
  • 28
11
votes
4 answers

Top Right Legend Position for a C3 chart?

Is there a way to position the legend in 'top right' for c3 charts? The current options appear to only allow 'bottom' and 'right'. I've noticed there is a 'Custom Legend Option'. However, I wanted to check before proceeding down this path. Thanks
Mark Collins
  • 358
  • 1
  • 2
  • 8
11
votes
8 answers

C3 chart sizing is too big when initially loaded

I am using the C3 JavaScript library for the display of graph data. When my page initially loads, the graphs are hidden. It isn't until a "tab" on the page is selected that the graphs display. The trouble I am seeing is that my first graph doesn't…
REW
  • 682
  • 2
  • 8
  • 23
10
votes
4 answers

Cookie not being set in iframe

I have an Identity Server (v4) on one server and a web application on a different server & domain. I only need windows authentication, and everything works fine with a redirect. However, I noticed that silent sign-in works if the cookie hasn't yet…
Fred Johnson
  • 2,109
  • 1
  • 23
  • 40
1
2 3
…
74 75