![]() Number - Spacing between data sets within X values Number - Spacing between each of the X value sets Boolean - If there is a stroke on each bar Boolean - Whether grid lines are shown across the chart ![]() Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value To then make use of it you can now declare your data with an extra option called type var data = , So i'll paste the new graph at the bottom of this answer as it's pretty large, to use it copy and paste it into your own chart.js file at the bottom or paste it after you include chart.js on your page. Whenever it is looping over the lineDataSets variable it is performing code from the current line graph and visa versa for the bar graph Then when it needs to draw/check-events /use-the-data it loops other both of the new datasets separately. So my solution was to create a new chart type called LineBar (could have gone for the extending option but before starting I felt like this was going to need a lot of method overriding so went for a new graph, it also means i didn't have to re-declare helpers as Chart.helpers not a huge thing but was reason enough at the time).Īt it's core it is the bar chart but it keeps a track of datasets in separate lineDataSets and barDataSets variables. Here is a fiddle showing it in action with a line and bar chart to compare against: Ok so had a quick go at seeing if this was possible and the short answer is yes but would need more work truly integrate this into the build of chart js. Chart.js 2.x supports this Chart.js how to get Combined Bar and line charts?ĮDIT 2 I have now added this feature to my custom build of chartjs if you want to use that the only difference is i named it Overlay not LineBar so to use it just create a graph using var myOverla圜hart = new Chart(lineBar).Overlay(data) everything else is the same though. The below answer is concerned with chart.js 1.x.
0 Comments
Leave a Reply. |