次のJSコードがあります
$(document).ready(function(){
$('.dial').each(function () {
var elm = $(this);
var color = elm.attr("data-fgColor");
var perc = elm.attr("value");
elm.knob({
'value': 0,
'min':0,
'max':200, // Set to 200 as a max
"skin":"tron",
"readOnly":true,
"thickness":.2,
'dynamicDraw': true,
"displayInput":false,
"font": 'Lato'
});
$({value: 0}).animate({ value: perc }, {
duration: 120,
easing: 'swing',
progress: function () {
elm.val(Math.ceil(this.value)).trigger('change')
}
});
//circular progress bar color
$(this).append(function() {
elm.parent().parent().find('.circular-bar-content').css('color',color);
elm.parent().parent().find('.circular-bar-content label').text(perc+' points');
elm.parent().parent().find('.circular-bar-content span').text(perc+' proposals');
elm.parent().parent().find('.circular-bar-content .jobs').text(perc+' proposals');
elm.parent().parent().find('.circular-bar-content .conv').text(perc+'%'); // THIS ROW
});
});
});
しかし、 // THIS ROW にコメントがあるものは、データベースからデータを取得しているため、200 に制限したくありません。この行に別の値を指定したいのですが、どうすればこれを行うことができますか?
データベースからのPHPがレンダリングされると、このhtmlが出力されます
<div class="col-md-3">
<div class="circular-bar">
<input type="text" class="dial" data-angleOffset=-125 data-angleArc=250 data-fgColor="#D2207E" data-width="150" data-height="150" data-linecap=round value="50.00">
<div class="circular-bar-content">
<strong style="padding-left: 8px; padding-top: -20px;">Conv Rate</strong>
<p class="conv"></p>
</div>
</div>
</div>