How to change candle stick color?
Hi, I want to change the candle stick color by up in red and down in green.
I read these articles. https://github.com/chartjs/chartjs-chart-financial/issues/114 https://github.com/chartjs/chartjs-chart-financial/pull/115 https://github.com/chartjs/chartjs-chart-financial/pull/37
I can not change the candle stick color by the ways these articles suggest.
I notice that these articles use [email protected] and [email protected]
Today the chart.js is [email protected]
How do I change the candle stick color by up in red and down in green?
Thank you.
Here's a working sample of reversing the up and down candle colors: jsfiddle
You can use whatever colors you want for the up, down or unchanged candles by specifying the color property like this:
var chart = new Chart(ctx, {
type: 'candlestick',
data: {
datasets: [{
label: 'CHRT - Chart.js Corporation',
data: barData,
color: {
up: 'rgba(215, 85, 65, 1)',
down: 'rgba(80, 160, 115, 1)',
unchanged: 'rgba(90, 90, 90, 1)'
}
}]
}
});
You can change the background of the candles by modifying the 'backgroundColors' parameter as shown in the code below:
const data = {
datasets: [
{
label: 'Candlestick Dataset',
data: stock,
borderColor: 'rgba(0, 0, 0, 1)',
borderWidth: 1,
backgroundColors: {
up: 'rgba(252, 34, 0, 1)',
down: 'rgba(0, 194, 84, 1)',
unchanged: 'rgba(143, 143, 143, 1)'
}
}
]
};
The value must be a string.
What if I want to highlight a single candle, making it a yellow one among reds and greens.