I am building some charts with Highcharts , but I have problems to change the colors of the bars of said chart, setting colorByPoint
to true the bars get a different color automatically without the possibility of choosing which color you want in each bar, and setting colorByPoint
to false you can choose the color that one prefers using color
: '#colorofyourpreference' , but when using the color in this way, all the bars in the series take on that single color. Here I leave the code that I have so that you understand what I mean
$(function () {
$('#container').highcharts({
chart: {
type: 'bar'
},
xAxis: {
categories: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic']
},
plotOptions: {
series: {
colorByPoint: true
}
},
series: [{
data: [26, 41.5, 100.5, 11.2, 210.0, 216.0, 137.0, 48.5, 21.4, 194.7, 99.6,156.3]
}, {
colorByPoint: false,
data: [26, 41.5, 100.5, 11.2, 210.0, 216.0, 137.0, 48.5, 21.4, 194.7, 99.6,156.3],
color: '#F75E25'
}]
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 400px"></div>
I only need to change the color of the month of March (example) in series 2, where all the bars have a single color, since I can't think of anything else to be able to change the color of that specific month.
You need to alter the Highcharts options with like this
setOptions
:The Highchart documentation says that the data structure has to assign the value, the titles, the color and several other options