Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
  • Jan 31 2019 22:56
    hieroglyph1 starred c3js/c3
  • Jan 31 2019 04:41
    paulcarroll starred c3js/c3
  • Jan 31 2019 01:24
    morukutsu starred c3js/c3
  • Jan 30 2019 20:54
    ebk13579 starred c3js/c3
  • Jan 30 2019 20:51
    stanzani starred c3js/c3
  • Jan 30 2019 18:02
  • Jan 30 2019 17:32
  • Jan 29 2019 22:08
    michaelreynolds starred c3js/c3
  • Jan 29 2019 21:00
    mikeringrose starred c3js/c3
  • Jan 29 2019 17:06
    mullerzs commented #2357
  • Jan 29 2019 07:40
    whbjob starred c3js/c3
  • Jan 29 2019 05:28

    kt3k on gh-pages

    Deploy c3js/c3 to github.com/c3… (compare)

  • Jan 29 2019 05:25

    kt3k on master

    Typo fix (#2568) (compare)

  • Jan 29 2019 05:25
    kt3k closed #2568
  • Jan 29 2019 01:38
    hiro-info starred c3js/c3
  • Jan 28 2019 16:32
    codecov-io commented #2568
  • Jan 28 2019 16:32
    codecov-io commented #2568
  • Jan 28 2019 16:29
    codecov-io commented #2568
  • Jan 28 2019 16:29
    codecov-io commented #2568
  • Jan 28 2019 16:27
    Salsao opened #2568
i'm having some trouble with a timeseries, xs, grouping chart
it calculates the ymax and change yaxis but the areas dont stack
this happens when i have different xs datas
is it supported with timeseries ?
Hi, can anyone confirm to me that .data.names() is returning {} no matter what?
Misha Manulis
hello, anyone know if it's possible to show html elements in the chart labels? e.g. I'd like to show the degree sign ° on the y-axis label
Saad K
Hi everyone,
Does anyone knows if there is a way to get c3 chart object to use in different functions
Hi all, does any1 know, is there an ability in c3 to "show zero values" on bar chart?
Hi all does anyone know how to do custom position for tooltip when we have xs in data?
Hi, can someone please tell me on how to implement "Common Legend for two or more charts on Same Page"
Does anyone know how to get a grouping of nodes selected based on the area a user drags on the chart?
Maybe someone can point me in the right direction?
Looks like they added the ondragend and removed it later. Is there a way to add this type of action using d3js
David Heppell
hey all, I'd managed to replicate and find the cause for issue #2251, minor display issue with rounding on negative x-axis values I'd also run into in the past, just wondering how I should go about replying about cause of issue/potential fix and making a PR, as the CONTRIBUTING.md file pretty much just states "Add something about PRs here"
Eugenio Arosteguy
Hi all :smile: do you know a way to do "scale breaks" in c3js?
something like https://betterdashboards.files.wordpress.com/2009/02/scalebreaks2.png
(I know how to "truncate" axis by setting man, min or range, but I want a explicit "break mark" to the user identify the break
Eugenio Arosteguy
any mark in axis will be usefull
Pascal Brewing
Hey Guys i have a questoin
  "clc_humidity": {
    "2018-02-26": [
        "value": "43.00",
        "time": "2018-02-26T09:39:00.000Z",
        "deviceId": "BBBRX",
        "type": "clc_humidity"
        "value": "50.86",
        "time": "2018-02-26T09:41:00.000Z",
        "deviceId": "BBBRX",
        "type": "clc_humidity"
        "value": "51.93",
        "time": "2018-02-26T09:50:00.000Z",
        "deviceId": "BBBRX",
        "type": "clc_humidity"
        "value": "47.93",
        "time": "2018-02-26T10:00:00.000Z",
        "deviceId": "BBBRX",
        "type": "clc_humidity"
        "value": "46.93",
        "time": "2018-02-26T10:10:00.000Z",
        "deviceId": "BBBRX",
        "type": "clc_humidity"
i have a stricture like this with many days
the user want to see 24 hours Chart from every day
i dont no what i have to use ?
i need a multiple timeseries chart
Pascal Brewing
anyone here :) ?
Damian Szidiropulosz
Pat RTomé
Hello, I am trying to change the tooltip title of a donut chart, depending on the slice. I can see how you change the title for a line chart, but when I use the same function ie title: function(d) {balboa} I get d undefined.
If I have my data as ['toto data1',1,2,3] I would like to have to have the title being 'toto'.
How do I get to this first element of my data? here is my COdePen test https://codepen.io/prtome/full/LmKPpy/
Thanks for any help!


Is there any way to display different colors for thresholds on Gauge?

Thanks for help !


Hello folks,

I am just new to c3.js . There is any possibility to implement the pie chart label in c3 like highchart => https://www.highcharts.com/maps-demo/pie-basic .


Michael Gregory
What's going on! Wondering if anyone has implemented a heat map using c3 / d3. I'm about to go down that route and it would be amazing if it were possible to reuse some of the config from my existing chart components that use c3.

hello Can we provide different max values for each data array in c3.js gauge graph
c3.js library accepts two data sources(example : production and time) in gauge graphs but only with one max value, Is there format to provide different max values for two data sources I used below format to accept two data sources for gauge graph

but this is accepting same max values for both data sources is there any provision for accepting two max values for each data source
refer this fiddle: https://jsfiddle.net/srinivasyl/nd25q7s6/8/

@rahul-winner yes there is way for provision threshold colors
color: {
pattern: ['red, 'green', 'yellow', 'blue'], // the three color levels for the percentage values.
threshold: {
values: [30, 60, 90, 100]
source https://c3js.org/samples/chart_gauge.html

I am trying to create multiple c3js graph in a page. Once one graph is loaded am trying to load other graphs. But when i try to load third chart first two charts are flickering. It is annoying for my page. As analyzed, c3's generate function vanish the div and regenerate the entire graph, But my requirement is existing chart object retain is enough. Please Someone guide me to solve this.

function loadingGraph() {     
   columns: [ values1]


Yoshiya Hinosawa
@kumaranc Could you share how you call the generate function?
var chart = c3.generate({
size: {
height: 166
data: {
columns: [
                type: 'bar'
            bar: {
                //width: {
                //  ratio: 0.5 // this makes bar width 50% of length between ticks
                // or
                width: 20 // this makes bar width 100px
            axis: {
                y: {
                    min: 0,
                    max: max,
                    label: {
                        text: 'aaaaa',
                        position: 'outer-top'
                    padding: {
                        top: 0,
                        bottom: 0
                    tick: {
                        count: 5
            grid: {
                x: {
                    lines: line
                y: {
                    lines: [{value: 0}]
Yoshiya Hinosawa
I think you should use bindto option in generate to control which chart binds to which dom element.
First create dom elements with ids and generate charts specifying those ids, and each chart works independently.
I've added bindto attribute in it and still it is flicker. Graph is generated but while updating other graphs am passing same set of data to the generated graph, it flickers. I've tried by passing same data in settimeout function it wont flickers. But while updating the panel it is flickering.
*I've tried settimeout in c3js site
Alexander Lenail
How does one do an update in c3.js? It seems like there are .load and .unload methods, but I'm not finding a way to do a generic update in the docs.
e.g. say data is [['a', 5], ['b',3],['c',7]] and I have a donut chart. Then data becomes [['a', 7], ['f',4],['c',5]]
Using the current API, I would need to do a .load(new_data) but also an .unload(['b'])
Is that right? Seems a little convoluted
hi. anyone here?
Paulo Menezes
Khadem Avinoor Alam
I have a line chart and a bar chart both have the same columns or data sets. I know in line charts, I can rename a column value/text using data.names but is there a way to do it for tick values/text for a bar chart?
Claudio Gamboa
Hi, can anyone tell me why in a timeseries bar chart with rotate true (horizontal bars) the recent date is in the bottom and not in the top? Thanks
Ambika Kumar
@/all How can I use multiple tooltip in the c3chart?
Zijing Zhang
How to import C3 to use it with Angular Project?