Я пытаюсь показать общее количество калорий, общее количество пройденных шагов, общее расстояние, пройденное в км.Легкий пирог дает мне результат в%, но я хочу показать, например: 1629 ккал, 3120 шагов и 2 300 км.все это в виде круговой панели.Кто-нибудь знает, как помочь мне исправить ошибку здесь?
<div class="col-md-4">
<div class="card-body">
<?php
echo"<div class='chart' data-percent='70'>
<span class='fa fa-fire'>
{$row['Calories']}
</span> KCAL</div>";
?>
</div>
</div>
</div>
<script>
$(function() {
$('.chart').easyPieChart({
// The color of the curcular bar. You can pass either a css valid color string like rgb, rgba hex or string colors. But you can also pass a function that accepts the current percentage as a value to return a dynamically generated color.
barColor: ' #800080',
// The color of the track for the bar, false to disable rendering.
trackColor: '#f2f2f2',
// The color of the scale lines, false to disable rendering.
scaleColor: '#dfe0e0',
// Defines how the ending of the bar line looks like. Possible values are: butt, round and square.
lineCap: 'round',
// Width of the bar line in px.
lineWidth: 26,
// Size of the pie chart in px. It will always be a square.
size: 250,
// Time in milliseconds for a eased animation of the bar growing, or false to deactivate.
animate: 1000,
// Callback function that is called at the start of any animation (only if animate is not false).
onStart: $.noop,
// Callback function that is called at the end of any animation (only if animate is not false).
onStop: $.noop
});
$('.updatePieCharts').on('click', function(e) {
e.preventDefault();
var newValue = Math.floor(100 * Math.random());
$('.chart').data('easyPieChart').update(newValue);
$('span', $('.chart')).text(newValue);
});
});
</script>