chart.js在我的本地主机上运行良好，但无法在线运行

chart.js working fine on my localhost but it is not working online

本文关键字：运行 在线 js 我的 主机 chart      更新时间：2023-09-26

chart.js在本地主机上运行良好，没有任何问题，但当我在线发布它时，它就不起作用了。。。我使用.load 从另一个页面接收饼图数据

在我的HTML代码下面：

<div id="canvas-holder">
<div  id="arafa" hidden></div>
<canvas id="chart-area"></canvas>   
</div>

下面是我的Jquery代码

window.onload = function () {
                $("#arafa").load("home_reports/profit_and_loses.php", {}, function () {
                    var income = $.trim($('#arafa').html());
                    var code = income.split("|");
                    var first_code =  code[0];
                    var second_code =  code[1];
                        var pieData = [
                        {
                            value: first_code,
                            color:"#F7464A",
                            highlight: "#FF5A5E",
                            label: "income"
                        },
                        {
                            value: second_code,
                            color: "#46BFBD",
                            highlight: "#5AD3D1",
                            label: "expenses"
                        },
                    ];
                        var ctx = document.getElementById("chart-area").getContext("2d");
                        window.myPie = new Chart(ctx).Pie(pieData);
                });

}

我认为问题是，图表函数在获取数据之前就被调用了。

window.onload = function () {
    setTimeout(function () {
        var ctx = document.getElementById("valueChart").getContext("2d");
        window.myLine = new Chart(ctx).Line(lineChartData, {
            responsive: true
        });
    }, 1000);
}

假设这只是您要理解的解决方案的一个示例。此处lineChartData是要在图表中显示的数据对象。为了在图表中处理这些数据，我使用了一个延迟1秒的settimeout函数。您可以使用此代码检查问题是否是延迟加载，如果是，则可以创建任何其他事件处理程序来串行加载对象和函数。

相关文章：