Рендеринг карт Google на основе сгенерированного массива - PullRequest
Новая
       4

Рендеринг карт Google на основе сгенерированного массива

0 голосов
/ 27 ноября 2018

Проблема:

Я пытаюсь представить это: enter image description here

Как Google Chart.Это мой массив: 

[
    [
        "3600000",
        21,
        9,
        12
    ],
    [
        "18000000",
        33,
        5,
        28
    ],
    [
        "86400000",
        211,
        14,
        197
    ],
    [
        "172800000",
        230,
        7,
        223
    ],
    [
        "259200000",
        145,
        1,
        144
    ],
    [
        "345600000",
        150,
        2,
        148
    ],
    [
        "432000000",
        266,
        5,
        261
    ],
    [
        "518400000",
        350,
        2,
        348
    ],
    [
        "604800000",
        398,
        3,
        395
    ],
    [
        "1209600000",
        2544,
        19,
        2525
    ],
    [
        "2592000000",
        3758,
        45,
        3713
    ],
    [
        "5184000000",
        5306,
        28,
        5278
    ]
]

Итак, я попытался сделать следующее: 

<Chart
    chartType="Line"
    loader={<div>Loading Chart</div>}
    data={[
        [
            'Czas',
            'Wszyscy',
            'Rozwiazujacy',
            'Uczniowie',
            // 'Admini',
        ],
        this.state.sortedForChart.map(ch => {
            console.log(ch);
            // This logs arrays like this:
            // ["259200000", 144, 1, 143]

            return ch;
        })
        // These are the examples provided by Google.
        // [1, 37.8, 80.8, 41.8],
        // [2, 30.9, 69.5, 32.4],
        // [3, 25.4, 57, 25.7],
        // [4, 11.7, 18.8, 10.5],
        // [5, 11.9, 17.6, 10.4],
        // [6, 8.8, 13.6, 7.7],
        // [7, 7.6, 12.3, 9.6],
        // [8, 12.3, 29.2, 10.6],
        // [9, 16.9, 42.9, 14.8],
        // [10, 12.8, 30.9, 11.6],
        // [11, 5.3, 7.9, 4.7],
        // [12, 6.6, 8.4, 5.2],
        // [13, 4.8, 6.3, 3.6],
        // [14, 4.2, 6.2, 3.4],
    ]}
    options={{
        chart: {
            title: 'Czestotliwosc logowania',
        },
    }}
/>

Но это не удалось.Ошибка говорит:

Ошибка: строка 0 имеет 13 столбцов, но должна иметь 4 jsapi_compiled_default_module.js: 129: 153

Так что я предполагаю, что на самом деле не возвращаетсязначение, потому что, если я делаю это: 

data={[
    [
        'Czas',
        'Wszyscy',
        'Rozwiazujacy',
        'Uczniowie',
    ],
    [
        "3600000",
        20,
        9,
        11
    ],
    [
        "5184000000",
        5306,
        28,
        5278
    ]
]}

Это дает хороший и точный график.Но я не могу придумать способ заставить его работать так, чтобы мне не приходилось вводить каждую часть массива.Любые идеи?

Редактировать: Это также работает: 

data={[
    [
        'Czas',
        'Wszyscy',
        'Rozwiazujacy',
        'Uczniowie',
        // 'Admini',
    ],
    // return this.state.sortedForChart.map(ch => ch);
    this.state.sortedForChart[0],
    this.state.sortedForChart[1],
]}

1 Ответ

0 голосов
/ 27 ноября 2018

Хорошо, решил! 

let dataForGeneralChart = [[
    'Czas',
    'Wszyscy',
    'Rozwiazujacy',
    'Uczniowie',
    // 'Admini',
]];

sortedForGeneralChart.forEach(ch => {
    dataForGeneralChart.push(ch);
});


<Chart
    chartType="Line"
    loader={<div>Loading Chart</div>}
    data={this.state.dataForGeneralChart}
    options={{
        chart: {
            title: 'Czestotliwosc logowania wszystkich',
        },
    }}
/>
...