jquery-按时间顺序对任何给定的json进行排序

hts6caw3  于 2021-09-23  发布在  Java
关注(0)|答案(1)|浏览(319)

我有一个json数组,我正试图将它渲染成chartistjs。但是,这个json的结果不是按时间顺序格式化的。

[
    {"May2021": "181287.56"},
    {"Mar2021": "94824.95"},
    {"Feb2021": "79316.17"},
    {"Apr2021": "107782.89"},
    {"Jan2021": "94802.65"},
    {"Jun2021": "100671.2"}
]

我使用的jquery逻辑是捕获月份值并将其呈现为x轴和y轴系列。

$(document).ready(function () {
  var months = {
    Jan: 0,
    Feb: 1,
    Mar: 2,
    Apr: 3,
    May: 4,
    Jun: 5,
    Jul: 6,
    Aug: 7,
    Sep: 8,
    Oct: 9,
    Nov: 10,
    Dec: 11
  };

  $.ajax({
    url:
      "https://flci9mttga.execute-api.ap-south-1.amazonaws.com/poc/costAggregateAPI",
    type: "GET",
    dataType: "json",
    async: true,
    crossDomain: true,
    success: function (response) {
      //console.log(response);
      var arrLabels = [],
        arrShortLabels = [],
        arrSeries = [],
        arrSortedSerise = [];

      $.map(response, function (item, index) {
        var dtM = item.substring(0, 3);
        var dtY = item.substring(3, 7);

        arrLabels.push(new Date(dtY, months[dtM]));
        arrShortLabels.push(new Date(dtY, months[dtM]).toDateString("MMYYYY"));
        arrSeries.push(item.Y);
      });

      arrShortLabels.sort(function (x, y) {
        let a = new Date(x),
          b = new Date(y);
        return a - b;
      });

      var data = {
        labels: arrShortLabels,
        series: arrSeries
      };
      demo.initDocChartist(data);
    }
  });
});

chartistjs插件的代码如下-

initDocChartist: function (data) {
    var dataSales = {
      labels: data.labels,
      series: [data.series]
    };

    var optionsSales = {
      lineSmooth: false,
      low: 0,
      high: 120000,
      showArea: true,
      height: "245px",
      axisX: {
        showGrid: false
      },
      lineSmooth: Chartist.Interpolation.simple({
        divisor: 3
      }),
      showLine: false,
      showPoint: false
    };

    var responsiveSales = [
      [
        "screen and (max-width: 640px)",
        {
          axisX: {
            labelInterpolationFnc: function (value) {
              return value[0];
            }
          }
        }
      ]
    ];

    Chartist.Line("#chartHours", dataSales, optionsSales, responsiveSales);

如果有人能帮我解决这个问题,我将不胜感激

8oomwypt

8oomwypt1#

对日期使用标准格式,如iso

手动输入数据而不知道编程的人有时只将日期写为“mar2020”,因为他们总是打算手动解释。
然而,作为一名程序员,您应该尝试始终以易于自动解释的明确方式存储信息。
我建议您将月份+年份转换为以下数字格式:

yyyy-mm

这很好,因为:
对于来自任何人类语言的程序员来说,这是明确的
一般民众都理解这一点
如果按字母顺序排序,它会自动按日期顺序排列
它是iso 1601数据格式的第一部分,在计算中被广泛理解和使用。

你快到了

而不是转换为 toDateString 使用

.toDateString("MMYYYY")

... 请尝试:

.toISOString().slice(0,7)

结果结构只是一个字符串,这意味着它是
易于明确存储
易懂
不存在日期类型有时出现的时区问题

您可以使用编辑器中的<>图标发布代码

人们会发现测试代码更容易,因此会更鼓励他们为您修改代码。

相关问题