Topic: Changing min-chart color depend on percent
Hello,
I begin to use the minimalist chart and it works well, but I would like to have a different color depending on the data-percent value.
For example: between 0 and 40, the chart is red, 40 and 80 orange and more than 80, green.
Is it possible to do that?
I try to find some information in the official page but I found Nothing interresting.
Add comment
Thank you very much.
To do this, I use PHP to add a "data-color" tag in my html code with the color to display, but your solution is really better. :)
Hi, Jouvrard!
Yes, it's possible. Also, it's very easy to do that. Just use this code:
$(function () {
$('#minChart').easyPieChart({
barColor: function (percent) {
return (percent < 40 ? '#ff4444' : percent < 80 ? '#ffbb33' : '#00C851');
},
onStep: function (from, to, percent) {
$(this.el).find('.percent').text(Math.round(percent));
}
});
});
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Resolved
Specification of the issue
- ForumUser: Pro
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.5.9
- Device: PC
- Browser: All
- OS: Windows 10
- Provided sample code: No
- Provided link: No