javascript - 为什么我的谷歌图表看起来不对

Question

所以我试图按分钟显示一些统计数据，但是图表......它看起来不对，还是我错了？

我这里有一个 jsfiddle 示例:https://jsfiddle.net/p0j5qfL9/1/

google.charts.load('current', {packages: ['corechart', 'line']});
google.charts.setOnLoadCallback(load_page_data);

function load_page_data(zoom,action,time,entry_id){

    zoom = typeof zoom !== 'undefined' ? zoom : 'date';
    action = typeof action !== 'undefined' ? action : 'banner view';
    time = typeof time !== 'undefined' ? time : $('.actions_logs .sort_time').val();
    entry_id = typeof entry_id !== 'undefined' ? entry_id : '';
    rows = [];

    $.ajax({
        url: "/stats/get-stats",
        data: {zoom : zoom, action : action, time: time, entry_id : entry_id},
        async: false,
        success: function(data){
            if(data){
                var json = jQuery.parseJSON(data);
                $.each(json, function( index, value ) {
                    date = new Date(value.created);
                    rows.push([new Date(value.created),parseInt(value.total)]);
                });

                drawBasic(rows,action,zoom);
            }
        }
    });
}

function drawBasic(rows,action,zoom) {

    var data = new google.visualization.DataTable(rows);
    column_type = (zoom == 'minute' || zoom == 'hour') ? 'datetime' : 'date';
    data.addColumn(column_type, 'Time of Day');
    data.addColumn('number', action);


    data.addRows(rows);

    var options = {
        title: 'Action',
        hAxis: {
            title: 'Time',
            format: (column_type == 'datetime') ? 'yyyy/M/d HH:mm' : null
        },
        vAxis: {
            title: 'Hits'
        },
        pointSize: 5,
        legend: { position: 'top', alignment: 'end' },
        animation: {"startup": true}
    };

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    $('.loading-chart').remove();
    chart.draw(data, options);
}

Answer 1

您的数据未按任何顺序排序，因此各行将根据日期来回移动。

添加所有数据后按数据日期排序将返回我认为您想要的内容。

rows.sort((a, b) => a[0] - b[0]);

这个 fiddle 的第 19 行 ->https://jsfiddle.net/p0j5qfL9/1/ https://jsfiddle.net/p0j5qfL9/3/

编辑:哎呀，链接错误。