How to update Minimalist charts barcolor?

web
mobile

Topic: How to update Minimalist charts barcolor?

boyd8811 pro asked 2 years ago

Can you please provide an example on how to update the barColor when value changes for the minimalist chart.

Piotr Glejzer staff answered 2 years ago

Hi,

We have a function for you.

$(function () {
$('.min-chart#chart-sales').easyPieChart({
barColor: function (percent) {
return (percent < 50 ? '#5cb85c' : percent < 85 ? '#f0ad4e' : '#cb3935');
},
size: 150,
scaleLength: 7,
trackWidth: 5,
lineWidth: 5,

onStep: function (from, to, percent) {
$(this.el).find('.percent').text(Math.round(percent));
}
});
});

Best regards,

Piotr


boyd8811 pro commented 2 years ago

Thank you very much!

Piotr Glejzer staff answered 2 years ago

Hello,

In our documentation in minimalist charts section we have an example how to change a color of charts.

Link to documentation (step 3):

https://mdbootstrap.com/javascript/charts/#usage-minimalist

Is that resolve your problem?

Best regards,

Piotr


boyd8811 pro commented 2 years ago

Maybe my question was not clear. Is it possilbe to update the color in onStep function? The code provided in your docs shows the barColor being set on initialize. I'm curious if this can be updated as it changes values.

Please insert min. 20 characters.
Status

Resolved

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No