-
Notifications
You must be signed in to change notification settings - Fork 11.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Bar chart color depending on the value. #5302
Comments
You can color each individual bar using an Array in backgroundColor. Just loop through your elements and color each bar accordingly: Fiddle-> https://jsfiddle.net/uq99110j/6/ |
@BVazquezAlvarez has the correct solutions |
If multiple datasets? In one one color of bar, in another another. |
The solution from @BVazquezAlvarez doesn't tell you what the green means, because there is only a single dataset, and therefore a single legend. You have to do it with two datasets, filter the data based on how the coloring should work, and then stack it like this: https://jsfiddle.net/Blueblau/wqs4c60o/ |
getting this error!(i am using chartsJS with ng charts for angular) |
It seems to be an internal error. |
TS:
Error: |
Do you have a canvas element with id myChart in your HTML? |
yes
|
Hello,
I'm doing a bar chart and I'd like that the bar with positive values had green color and red the negative values. I guess there must be a not so complicated solution for this because it's a very logical request, but I can't find it.
`var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: info.dates,
datasets: [{
label: info.label + ' ' + info.unit,
data: info.numbers,
backgroundColor: 'green',
borderWidth: 0,
fill: true,
pointRadius:0,
pointHitRadius: 10
}]
},
options: {
scales: {
`
Thanks a lot.
The text was updated successfully, but these errors were encountered: