0

http://jsfiddle.net/Ln83xd1k/

I've created a C3 bar chart, but I don't have multiple sets per column. I only have the values per-item. It seems like it should be a nice classic easy bar chart to create... but I can seem to only create a chart that has n-datapoints; the columns seem like they aren't supposed to only have one value.

var chart = c3.generate({
    data: {
        columns: [
            ['data1', 30],
            ['data2', 20],
            ['data3', 50],
            ['data4', 3],
            ['data5', 13]
        ],
        type: 'bar'
    }
});
Jason Crist
  • 138
  • 5

1 Answers1

0

So based on your comments, this is what you can do:

var cols = [
  ['data1', 30],
  ['data2', 20],
  ['data3', 50],
  ['data4', 3],
  ['data5', 13]
];

c3.generate({
  data: {
    columns: cols,
    type: 'bar'
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<div id='chart' />

You can change the type: "bar" to type: "pie" and you'll get exactly the pie chart you mention. This is the bar chart equivalent.

This brings us back to the beginning though - isn't that what you had to start?

I suspect you'll want to remove the zero on the x-axis (can be done) and add spacing between the columns?

Sean
  • 14,359
  • 13
  • 74
  • 124
  • ALMOST what I was looking for; except that I wanted to keep the five different color; complete with a legend at the bottom that linked the colors with what you have labeled 'cat1', etc. Coloring the categories as you demonstrate colors the bar but loses the legend. – Jason Crist May 25 '15 at 19:36
  • Still a bit unclear what you're asking for. Can you revisit your original question? Do you just want your original example with spaces between the bars? – Sean May 26 '15 at 19:32
  • I want the chart to look like your second example (with the categories under each bar) but for each bar to be a unique color and with that color to be in the legend. Pretty much every bar chart I ever made in grade-school. :P The situation works easily with a pie chart, I just want the same kind of results in a bar chart. – Jason Crist May 26 '15 at 20:19