在数据表中显示Apex图表

如何解决在数据表中显示Apex图表

我正在努力在数据表中添加图表。我正在使用Apex图表和DataTable jQuery插件。

我收到以下消息“错误：找不到元素apexcharts.min.js：14”。 我想是由于id =“ apex-mixed-2在Apex呈现图表时尚不可用，但我找不到解决方案。

目前，我想为所有数据行添加相同的图表。

数据表代码

print('worker pid: {},module name: {}'.format(os.getpid(),__name__))

简单的Apex图表

    $(document).ready(function() {
    "use strict";
    $("#products-datatable").DataTable({
        ajax:{url: "../assets/data/jsdata.json",dataSrc:""},columns: [
            {
                "data": "Url","render": function(data,type,row) {
                    return '<img src="'+data+'" alt="table-user" class="mr-2 rounded-circle" style="height: 70px;"/>';
                }
            },{ "data": "Customer" },{ "data": "Phone" },{ "data": "Balance" },{ "data": "Orders" },{ "data": "Last Order" },{ "data": "Status" }
            {
                "data": "Graph",row,Meta) {
                    return ' <div id="apex-mixed-2"</div>';
                }
            }            
        ]
    })
});

解决方法

要在Datatables的AJAX请求加载内容后完成代码，请使用drawCallback属性。

$('#products-datatable').DataTable({
  ajax: {
    url: '../assets/data/jsdata.json',dataSrc: ''
  },drawCallback: () => {
    // call your chart initialisation code here...
  },columns: [
    {
      data: 'Url',render: data => `<img src='${data}' alt='table-user' class='mr-2 rounded-circle' style='height: 70px;'/>`
    },{ data: 'Customer' },{ data: 'Phone' },{ data: 'Balance' },{ data: 'Orders' },{ data: 'Last Order' },{ data: 'Status' }
    {
      data: 'Graph',render: () => ' <div id="apex-mixed-2"></div>'
    }            
  ]
})