2

Using Easy Pie Chart, I am trying to change the value of attribut data-percent with value from JSON, but using the ways I normally do in jQuery (3.5.1), does not work in this case, and I cannot figure out why.

The DIV I am trying to set the data-percent on is:

<div class="chart easy-pie-chart-1" id="ConversionCostPercentage" data-percent="">
  <span class="percent1"></span>
</div>

The jQuery I have tried to set the value with :

$('#ConversionCostPercentage').attr('data-percent', thejson.ConversionCostPercentage);

and

$('#ConversionCostPercentage').data('percent', thejson.ConversionCostPercentage);

Doing a console.log(thejson.ConversionCostPercentage) returns 55 at the moment .. Anyone have a clue?

Stig Kølbæk
  • 432
  • 2
  • 18
  • Setting the `data` attribute *after* the chart has been rendered is most likely too late for it to have an effect. You need to set it *before* you initialise the chart, or check the library's documentation to see if it has a method of updating the values of the data. after initialisation – Rory McCrossan Jun 16 '21 at 14:39
  • Hi @RoryMcCrossan that was a really good point .. but my structure is initial DIV -> jQuery (JSON Request) -> Easy Pie Chart .. I just tried to move the jQuery (JSON Request) to the beginning of my BODY but that did not help .. I will have a look at the documentation again to see if I can find a clue :-) – Stig Kølbæk Jun 16 '21 at 14:46
  • 1
    THANK you @RoryMcCrossan, you led me in the right direction .. in the documentation there was a specific line of jQuery code that is need to be called, so what fixed it was : $('.chart').data('easyPieChart').update(thejson.ConversionCostPercentage); .. you deserve the points if you want them, just place an answer :-) – Stig Kølbæk Jun 16 '21 at 14:55
  • Glad you solved the issue. I'd suggest that it'd probably be better if you answered the question yourself including that specific detail, all I did was point you where to find it :) – Rory McCrossan Jun 16 '21 at 15:49
  • Sometime @RoryMcCrossan, all you need *is a small push in the right direction to get to your goal ;-) .. Thanks again :-) – Stig Kølbæk Jun 16 '21 at 20:57

1 Answers1

1

With a little push from @RoryMacCrossan I was let in the right direction to solve it .. I went to Easy Pie Chart GitHub site and looked at the documentation, and fell over 3 little jQuery examples (https://github.com/rendro/easy-pie-chart#jquery-1) which resultet in using the below, which fixed it:

$('.chart').data('easyPieChart').update(thejson.ConversionCostPercentage);
Stig Kølbæk
  • 432
  • 2
  • 18