【问题标题】:Issue- How to order google graph chart row data by date问题-如何按日期订购谷歌图表行数据
【发布时间】:2021-08-31 05:34:31
【问题描述】:

我对图表完全陌生。

我刚刚开始使用 Google 图表 API,但我被困在了这一点上。

我实现的图表完美地显示了数据,但数据段不正确。

我正在尝试更正日期段,但未能找到完美的解决方案


这是脚本代码:-

google.charts.load('current', {'packages':['line']});
    google.charts.setOnLoadCallback(drawChart);
    function drawChart() {
       var previewsvalue = '';
        var newsvalue = '';
        var data = new google.visualization.DataTable();
        data.addColumn('date', 'X');
        data.addColumn('number', 'Figure Cost');
        for (var i = 0; i < statsdata.length; i++)
        {
            previewsvalue = +statsdata[i].payment_amount + +newsvalue;
            data.addRow([new Date(statsdata[i].starting_date),Number(previewsvalue) ]);
            newsvalue = previewsvalue;
            console.log('previewsvalue',previewsvalue) 
        }
        data.sort([{column: 1}, {column: 0}]);
      var options = {
        chart: {
          title: 'Its a demo Graph,',
          subtitle: 'in Euro(€)'
        },
        hAxis: {
          title: 'Starting At'
        },
        vAxis: {
            title: "Payment Amount",
        }
      };
      var formatter = new google.visualization.NumberFormat(
    {prefix: '€', negativeColor: 'red', negativeParens: true});
formatter.format(data, 1);
      var chart = new google.charts.Line(document.getElementById('chart_div'));

      chart.draw(data, google.charts.Line.convertOptions(options));
    }

这是我在谷歌图表脚本中使用的多维数组

[{"payment_amount":"100","starting_date":"2020-12-31T23:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-01-31T23:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-02-28T23:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-03-31T22:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-04-30T22:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-05-31T22:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-06-30T22:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-07-31T22:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-08-31T22:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-09-30T22:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-10-31T23:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-11-30T23:00:00.000000Z"},{"payment_amount":"100","starting_date":"2021-06-16T22:00:00.000000Z"},{"payment_amount":"10","starting_date":"2021-06-29T22:00:00.000000Z"},{"payment_amount":"600","starting_date":"2021-07-12T22:00:00.000000Z"},{"payment_amount":"0","starting_date":"2021-07-30T22:00:00.000000Z"}]

我的英语不好,但我想解释一下我的观点。我该如何解决? 如何按开始日期对多维数组进行排序? 如果上一个值为 12,新值为 100,则下一个值为 120

【问题讨论】:

    标签: javascript sorting multidimensional-array charts google-visualization


    【解决方案1】:

    排序方法导致行显示乱序。

    data.sort([{column: 1}, {column: 0}]);
    

    这样颠倒列顺序...

    data.sort([{column: 0}, {column: 1}]);
    

    【讨论】:

    • 感谢其工作,但由于此解决方案而引发了一个问题。如果你看到我的剧本。我将以前的值与新值相加,所以它的显示就像资产负债表一样。但现在它没有那样显示,任何解决方案。我添加了一个有问题的新屏幕截图。 @WhiteHat
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-11-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多