Chartjs-How to modify horizontal bar chart using chart js

0👍

Figuring this out requires looking through chart.js configurations here.

  1. To add a label on another line for the Y-axis your labels need the following structure labels: [["Dept1", 81], ["Dept2", 82], ["Dept3", 83]].

  2. Chart.js 2.0 can handle negative values by default so all you need to do is pass in your respective data points. Something like this should be fine: data: [12, -19, 5],

  3. The rounded corners problem is a little trickier. I used an external library linked here. There is some canvas rendering trickery going on. Be sure to star his repo to give the author credit!

Resulting Fiddle here: https://codepen.io/anon/pen/gKRQZG?editors=1000

Leave a comment