当前位置: 首页 > 工具软件 > easyPieChart > 使用案例 >

jQuery 的easyPiechart使用

苏鸿才
2023-12-01

1.首先引入不多说这个
2.通过js动态改变data-precent数值
html

   <div >
                            <div class="easyPieChart"  data-percent="73" style="width: 110px; height: 110px; line-height: 110px; "><span id="display_pre">73%</span><canvas width="110" height="110"></canvas></div>
                            <div class="chart-bottom-heading"><span class="label label-info">男女比例</span></div>
                        </div>

js代码,我这里的res.rate是我数据库返回的数据,你要根据自己数据修改

  $('.easyPieChart').data('easyPieChart').update(res.rate);
   $("#display_pre").html(res.rate+"%");

坑:

1.data-parcent应该是给插件用的属性,动态修改有可能插件初始化后没有效果,用setAttribute()函数我是不行,造成没有效果。其中这个修改HTML直接div也是不行了会没效果,所以我在div里加了一个span后修改span不会造成没效果$("#display_pre").html(res.rate+"%");

 类似资料: