How to remove border from stacked column chart in Chartkick - Chart.js

Question

I am using chart.js throug chartkick gem.

= column_chart [{"name":"A","data":[["2016-07-01",1],["2016-08-01",0],["2016-09-01",0]]},{"name":"B","data":[["2016-07-01",1],["2016-08-01",0],["2016-09-01",0]]}], xtitle: "Date Range", ytitle: "Counts", stacked: true, height: "600px"

I am getting following chart:

I don't want any border around stacked blocks. I want to set border to 0. How can I achieve this using chartkick gem?

I tried adding this on page load in application.js.

Chart.defaults.global.elements.rectangle.borderwidth = 0;

But this is not working.

Answer 1

You have to override the chart.js library that you have added to your assets. You can set the dataset.borderWidth to 0.

Simply replace the dataset.borderWidth with 0.

And it should work.

Answer 2

It took me some time to figure it out myself but the answer is actually hidden on https://github.com/ankane/chartkick between countless other examples:

<%= line_chart data, dataset: {borderWidth: 10} %>

So for a barchart to lose the border it is:

<%= bar_chart data, dataset: { borderWidth: 0 } %>