FVANCOP / ChartNew.js

MIT License
420 stars 142 forks source link

Set background for each bar in horizontal bar chart #431

Closed PtrBld closed 8 years ago

PtrBld commented 8 years ago

First of all thanks for this amazing library.

I wanted to ask if there is a way to set the background of each bar. Example: http://jsfiddle.net/ayy2vxsj/ So i noticed it is possible by extending the chart.js library but I wanted to use your horizontalBarChart for my puropse.

Thanks i advance

FVANCOP commented 8 years ago

Hi,

In current version, it is not yet possible with (Horizontal)Bar Chart but :
-> well possible with (Horizontal)StackedBar -> not difficult to implement in the (Horizontal)Bar Chart. => I will do it in the following days.

PtrBld commented 8 years ago

Ok cool. Thank you so much!

FVANCOP commented 8 years ago

options complementaryBar, complementaryColor and complementaryStrokeColor added for Bar and HorizontalBar charts.

Set option "complementaryBar : true" to get the complementary (what you call "background" bar).

The color and stroke color of the complementary bar can be changed with options complementaryColor and complementaryStrokeColor.

Documentation : https://github.com/FVANCOP/ChartNew.js/wiki/100_070_Graph_Layout#complementarybar

Important : Currently (April 2016), those options are only available from following branch : https://github.com/FVANCOP/ChartNew.js/tree/complementaryBar and NOT in the official ChartNew.js code. As long as this branch exists, download the (zipped) code from that link. Reason : I'm currently busy with the developpement of big changes. Some of those changes are already implemented in the published branch. Those changes have no impact but I prefer to not merge this branch with partial changes.

Tip : such a complementary bar is interresting when you display percentage in a bar chart. I should advice to set option "graphMax : 100 " for such charts.

PtrBld commented 8 years ago

Thank you, that is exactly what I needed. I am using it indeed for displaying percentage data so thank you for the great tip!