Извлеките правильные значения из массива для Google Charts (google.visualization) - PullRequest
0 голосов
/ 08 июля 2019

Мне нужно создать динамические Google Charts, которые получают данные из хранимой процедуры SQL.Мне удалось выложить фактическую таблицу с помощью функции ниже.

            var ajax = new XMLHttpRequest();
            var method = "GET";
            var url = "data.php";
            var asynchronous = true;
            ajax.open(method, url, asynchronous);

            //sending ajax request
            ajax.send();            

            // receiving response from data.php
            ajax.onreadystatechange = function()
            {
                if (this.readyState == 4 && this.status == 200)
                {
                    //converting JSON back to array
                    var dataTable = JSON.parse(this.responseText);
                    console.log(dataTable); // for debugging

                    // html value for <tbody>
                    var html = "";
                    // looping through the data
                    for (var a = 0; a < dataTable.length; a++)
                    {
                        var categoryValue = dataTable[a].Category;
                        var monthJan = dataTable[a].Month1;
                        var monthFeb = dataTable[a].Month2;
                        var monthMar = dataTable[a].Month3;
                        var monthApr = dataTable[a].Month4;
                        var monthMay = dataTable[a].Month5;


                        // appending at HTML
                        html += "<tr>";
                        html += "<td>" + categoryValue + "</td>";
                        html += "<td>" + ~~monthJan + "</td>";
                        html += "<td>" + ~~monthFeb + "</td>";
                        html += "<td>" + ~~monthMar + "</td>";
                        html += "<td>" + ~~monthApr + "</td>";
                        html += "<td>" + ~~monthMay + "</td>";

                        html += "</tr>";
                    }

                    //replacing the tbody of table
                    document.getElementById("data").innerHTML = html;   
                }
            }

В консоли я вижу свои массивы следующим образом:

0: {CategoryID: "7", Category: "Chimney Systems", Month1: "15", Month2: "7", Month3: "11", …}
1: {CategoryID: "11", Category: "Dov", Month1: "14", Month2: "14", Month3: "11", …}
2: {CategoryID: "6", Category: "Electric Fires", Month1: "52", Month2: "16", Month3: "31", …}
3: {CategoryID: "5", Category: "Electric Stoves", Month1: "20", Month2: "9", Month3: "14", …}
4: {CategoryID: "3", Category: "Gas Fires", Month1: "81", Month2: "45", Month3: "48", …}
5: {CategoryID: "4", Category: "Gas Stoves", Month1: "16", Month2: "12", Month3: "8", …}
6: {CategoryID: "10", Category: "Lot", Month1: "13", Month2: null, Month3: "3", …}
7: {CategoryID: "9", Category: "Nord", Month1: "8", Month2: "9", Month3: "7", …}
8: {CategoryID: "2", Category: "Solid Fuel Fires", Month1: "19", Month2: "12", Month3: "7", …}
9: {CategoryID: "1", Category: "Solid Fuel Stoves", Month1: "45", Month2: "27", Month3: "25", …}
10: {CategoryID: "12", Category: "Var", Month1: null, Month2: null, Month3: null, …}
11: {CategoryID: "8", Category: "Yeo Gas & Electric", Month1: "26", Month2: "21", Month3: "6", …}
12: {CategoryID: "8", Category: "Yeo Solid Fuel Stoves", Month1: "26", Month2: "21", Month3: "6", …}
13: {CategoryID: "0", Category: "Total", Month1: "335", Month2: "193", Month3: "177", …}

Мне нужно интегрировать эти данные всделать мои диаграммы Google динамическими, см. статические здесь .Каков наилучший способ перейти к целевым значениям, которые мне нужны для каждого графика?

...