Reverse direction from horizontal to c3js

-2

I'm using the c3js framework, how do I change the direction of the graph?

My current code.

    var chart = c3.generate({
    data: {
        columns: [
            ['data1', 30, 200, 100, 400, 150, 250],
        ],
        types: {
            data1: 'bar',
        }
    },
});
    
asked by anonymous 10.10.2018 / 16:11

1 answer

5

To change the position of the x and y axes, use axis.rotated .

Default : false

Format:

axis: {
  rotated: true
}

Font

Example

var chart = c3.generate({
  bindto: '#chart',
  padding: {
    left: 60
  },
  data: {
    x: 'x',
    columns: [
      ['x', 'Category1', 'Category2'],
      ['value', 300, 400]
    ],
    type: 'bar'
  },
  axis: {
    rotated: true,
    x: {
      type: 'category'
    }
  }
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.css" rel="stylesheet" type="text/css">

<div id="chart"></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js"></script>
    
10.10.2018 / 16:37