如何解决将迷你图饼图从 javascript 添加到 Jquery DataTable
我正在尝试使 sparklines
饼图在 JQuery Datatables
中动态呈现。我可以像这样将 JQuery sparklines
饼图添加到 JQuery DataTable
中:
<table id="dt-basic-example"
class="table table-bordered table-hover table-striped w-100">
<thead>
<tr>
<th>pie_chart</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<span class="sparklines" sparkType="pie" sparkHeight="50" sparkWidth="auto" values="4,6,7,4"> </span>
</td>
</tr>
</tbody>
</table>
如何在 $(document).ready()
时添加相同的饼图?
我试过了,但没有用:
var myData = [
{
pie_chart: '<span class="sparklines" sparkType="pie" sparkHeight="50" sparkWidth="auto" values="4,4"> </span>'
}
];
$(function () {
$('#dt-basic-example').dataTable({
data: myData,columns: [
{data: 'pie_chart'}
]
});
解决方法
我向 sparkline
元素添加了 class 并使用新值重新绘制它。
var myData = [
{
pie_chart: '<span class="sparklines top10" sparkType="pie" sparkHeight="50" sparkWidth="auto" values="4,6,7,4"> </span>'
},$('#dt-basic-example').dataTable({
data: myData,columns: [
{data: 'pie_chart'},],responsive: true,searching: false,paging: false,info: false
});
$('.top10').sparkline([1,2,3,4],{
type: 'pie',height: '50',width: '50'
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。