在页面上加载图表

Load amchart on page

本文关键字：加载      更新时间：2023-09-26

代码如下:

var check = parametrTable.length -1;
var data = [];
$.each(parametrTable, function(i, x) { // NOTE: x = parametrTable[i]
    $.getJSON("myurlwithparametr", function(json) {
        $.each(json, function(j, d) {
            data[j] = data[j] || {};
            data[j]["count" + i] = d.count;
            if (i == 0) {
                data[j].category = d.column;
            }
        });
        if(i == check){
                       loadChart(data);
                   }
    });
});

这部分从我的amchart生成数据，接下来如果'i' == 'check'(每个循环结束)，我发送生成数据到函数'loadChart'参数'data'。我的函数代码:

    AmCharts.ready(function() {
    chart = new AmCharts.AmSerialChart();
    chart.dataProvider = data;
    chart.categoryField = "category";
    chart.startDuration = 1;
    chart.type = "serial";

    var categoryAxis = chart.categoryAxis;
        categoryAxis.labelRotation = 90; 
        categoryAxis.axisAlpha = 1;
        categoryAxis.insie = true;
        categoryAxis.gridPosition = "start";
    var valueAxis = new AmCharts.ValueAxis();
        valueAxis.title = "title";
        valueAxis.axisAlpha = 1;
        chart.addValueAxis(valueAxis);
    for (i=0;i<data.length;++i) {
        var graph = new AmCharts.AmGraph();
        graph.valueField = "count"+i+"";
        graph.balloonText = "[[value]]";
        graph.bullet = "round";
        graph.type = "smoothedLine";
        graph.lineAlpha = 1;
        graph.connect = true;
        graph.lineThickness = '2';
        //graph.fillAlphas = 1;
        chart.addGraph(graph);
    }
        chart.write('chartdiv');
    });

在我的页面我有div与id = 'chartdiv'。当我检查函数表(数据)中的值看起来不错，但我的图表没有再生。:(当我跳过

AmCharts.ready(function() {
生成

图表，但不是生成所有的值。有什么建议吗?

在没有看到实际数据的情况下很难判断，但问题似乎在于您如何创建图形。现在，您正在为数据中的每个数据点创建一个单独的图。这似乎不对。您应该为parametrTable:

中的每个项目创建一个
for (i=0;i<=check;++i) {
        var graph = new AmCharts.AmGraph();
        graph.valueField = "count"+i+"";
        graph.balloonText = "[[value]]";
        graph.bullet = "round";
        graph.type = "smoothedLine";
        graph.lineAlpha = 1;
        graph.connect = true;
        graph.lineThickness = '2';
        //graph.fillAlphas = 1;
        chart.addGraph(graph);
}

另外，jQuery AJAX调用是异步的。这意味着您的.each()周期在实际数据加载之前完成。

需要单独的迭代器来跟踪加载项的数量。例如:

var check = parametrTable.length -1;
var loaded = 0;
var data = [];
$.each(parametrTable, function(i, x) { // NOTE: x = parametrTable[i]
    $.getJSON("myurlwithparametr", function(json) {
        loaded++;
        $.each(json, function(j, d) {
            data[j] = data[j] || {};
            data[j]["count" + i] = d.count;
            if (i == 0) {
                data[j].category = d.column;
            }
        });
        if(loaded == check){
           loadChart(data);
        }
    });
});
相关文章：