amCharts 4 используя POST с javascript - PHP - PullRequest
0 голосов
/ 26 февраля 2020

Я пытаюсь создать диаграмму, используя AMCHARTS 4. Проблема в том, когда я возвращаю данные. Я использую Javascript для доступа к PHP и возврата массива JSON.

$.post({
            url: "handle.php", // the resource where your request will go through
            type: "POST", // HTTP verb
            data: {action: "grafico", periodo: $('#periodo2').val(), datade: $('#datade2').val(), dataate: $('#dataate2').val()},
            success: function (response) {
                var result = JSON.parse(response);  // convert response 
                        var dataPoints = result.html1; // return array, i will use html1.
                        alert(dataPoints)
                        // primeiro mapa - chart
                        am4core.ready(function() {

                        // Themes begin
                        am4core.useTheme(am4themes_animated);
                        // Themes end

                        // Create chart instance
                        var chart = am4core.create("chartdiv", am4charts.XYChart);


                        // Add data
                        chart.data = dataPoints;  // here is the return


                        // Create axes
                        var categoryAxis = chart.xAxes.push(new am4charts.CategoryAxis());
                        categoryAxis.dataFields.category = "tipo";
                        categoryAxis.title.text = "Status da Ordem de Carregamento";
                        categoryAxis.renderer.grid.template.location = 0;
                        categoryAxis.renderer.minGridDistance = 20;
                        categoryAxis.renderer.cellStartLocation = 0.1;
                        categoryAxis.renderer.cellEndLocation = 0.9;

                        var  valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
                        valueAxis.min = 0;
                        valueAxis.title.text = "Quantidade";

                        // Create series
                        function createSeries(field, name, stacked) {
                          var series = chart.series.push(new am4charts.ColumnSeries());
                          series.dataFields.valueY = field;
                          series.dataFields.categoryX = "tipo";
                          series.name = name;
                          series.columns.template.tooltipText = "{name}: [bold]{valueY}[/]";
                          series.stacked = stacked;
                          series.columns.template.width = am4core.percent(95);
                        }

                        createSeries("a", "Aguardando", false);
                        createSeries("z", "Finalizado", true);
                        createSeries("f", "Cancelado", true);
                        createSeries("n", "Andamento", true);

                        // Add legend
                        chart.legend = new am4charts.Legend();
                        if (chart instanceof am4core.ColorSet) {
                            chart.list = [
                              am4core.color("#1BA68D"),
                              am4core.color("#E7DA4F"),
                              am4core.color("#E77624"),
                              am4core.color("#DF3520"),
                              am4core.color("#64297B"),
                              am4core.color("#232555")
                            ];
                          }

                        }); // end am4core.ready()
}
});

JSON вывод:

[ {
 "tipo": "OutBound",
 "a": 1,
 "z": 0,
 "f": 0,
 "n": 0,
 }, {
 "tipo": "InBound",
 "a": 0,
 "z": 1,
 "f": 0,
 "n": 0,
 }, {
 "tipo": "Vira",
 "a": 0,
 "z": 0,
 "f": 1,
 "n": 0,
 }, {
 "tipo": "Devolução",
 "a": 0,
 "z": 0,
 "f": ,
 "n": 1,
 } ]

Если я подпишусь на скрипт, он будет работать. Я не знаю, в чем разница, если я вернусь таким образом, это не сработает. chart.data = dataPoints;

Вы знаете, в чем проблема?

...