0

我想制作一个幻灯片，其中包含两个加载在两个仪表板上的仪表板 Divs。

<div id="chartContainer1"></div>
<div id="chartContainer2"></div>

我只有这两个Divs，在页面加载时，我正在Json调用以获取一些数据，然后使用Chartjs“一个 Jquery 插件”填充了仪表板，所以问题是如何将这两个仪表板放在幻灯片放映中？这是我的页面代码

 <div id="chartContainer1"></div>
    <div id="chartContainer2"></div>
    <script type="text/javascript">
        //var dataSource = $("#chartContainer").dxChart('option', 'dataSource', {});
     $.ajax({
            type: "POST",
            url: '@Url.Action("StatesChart", "Home")',
            dataType: "html",
            success: function (data) {
                var array = JSON.parse(data);
                $("#chartContainer1").dxPieChart({
                    dataSource: array,
                    title: "",
                    tooltip: {
                        enabled: true,
                        format: "decimal",
                        percentPrecision: 2,
                        //the text that will be shown on hober on any part of the pie
                        customizeText: function() {
                            return this.valueText + " - " + this.percentText;
                        }
                    },
                    //right details
                    legend: {
                        horizontalAlignment: "right",
                        verticalAlignment: "top",
                        margin: 4
                    },
                    series: {
                        type: "doughnut",
                        argumentField: "StateName",
                        valueField: "AllAssetsNumber",
                        label: {
                            visible: true,
                            format: "decimal",
                            connector: {
                                visible: true
                            }
                        }
                    }
                });
            },
            error: function () {
                alert('Save Failure', "error");
            }
        });

    </script>
4

0 回答 0