Amcharts.js dataProvider does not recognize object list

I am trying to use amchart to display charts on a website using HTML. I read the tutorial here . My code is mostly copied from the tutorial and if I use their list of objects it will show, but if I use mine it won't show. I am building my list of objects like this:

    var coordList = [];

    function coord(x,y) {
        this.x_coord = x;
        this.y_coord = y;
    }

    var newCoord = new coord(line[0],y_value);
    coordList.push(newCoord); 

      

I have a "for" loop that creates new objects to be placed inside a list. It will display a chart if the CoordList file is written like this:

    coordList = [{"x_coord":"Monday","y_coord":4}];

      

Can someone please help me understand what is wrong with my list of objects created with the constructor?

EDIT: Ok, after testing it seems like I just don't understand how JS works.

var coordList = []; // list of coordinates {x,y}

$(document).ready(function() {
    $.ajax({
    type: "POST",
    url: "./test.csv",
    dataType: "text",
    success: function(data) {
        processData(data);
        console.log(coordList);
        displayChart();
        console.log("hello");
    }
    });
});

      

The above is the main part of the code. Previously, displayChart () was outside the finished part of the document, that is, the chart without data would be immediately displayed, since the data has not yet been processed (correct me if I'm wrong?). Since then I have placed it inside the finished document part. We hope that when the document is ready, the data will be processed and displayed on the chart. However, it still doesn't work.

This is what displayChart () looks like:

    function displayChart() {

        //coordList = [{"x_coord":"Monday","y_coord":4}];
        console.log(coordList);

                var chart = new AmCharts.AmSerialChart();
                chart.dataProvider = coordList;
                chart.categoryField = "x_coord";    

                console.log("hello2");

                var graph = new AmCharts.AmGraph();
                graph.valueField = "y_coord";
                graph.type = "column";
                chart.addGraph(graph);

                chart.write('chartdiv');
    }

      

EDIT # 2: I WRITTEN OUTSIDE, ALL SCRIPT MUST BE INSIDE AMCHART READY! It can be closed, I don't know if I can do it myself?

+3


source to share





All Articles