微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Highcharts Angular - Highcharts 错误 #12

如何解决Highcharts Angular - Highcharts 错误 #12

我正在尝试在此 API 的折线图中显示数据,x 轴上为“日期”值,y 轴上为“宣布”值。我得到 Highcharts Error #12 并且数据没有显示在图表上。我已将 series.data 属性构造为如下所示:[[date,announces],[date,...]。这是我的代码

dataChart: SequenceChartData[] = [];
bucketAnnouncements: Array<[Date,number]> = [];

ngOnInit(): void {
    this.chartService.getSequenceChartData(this.data.peerAS,this.data.peerIPAddress,this.data.prefix)
    .subscribe((data: SequenceChartData[]) => {
      this.dataChart = data;
      this.update = true;
      this.show = true;
      let firstDay = Infinity;
      let lastDay = -Infinity;
      for (const val of this.dataChart){
        const date = moment.utc(val.date).unix();
        if (firstDay > date) {
          firstDay = date;
        }
        if (lastDay < date) {
          lastDay = date;
        }
      }
      for (let n = firstDay; n <= lastDay; n += 300) {
        this.bucketAnnouncements[n] = [
          new Date(n * 1000),0
        ];
      }
      for (const val of this.dataChart) {
        const date = val.date;
        this.bucketAnnouncements[moment.utc(date).unix()][1] = val.announces;
      }

      this.chartOptions.series = [
          {
            name: 'ao',type: 'line',data: this.bucketAnnouncements,color: '#009879',}
        ];
        });
    }

使用 console.log 似乎正确分配了数据:

1546300800: (2) [Tue Jan 01 2019 01:00:00 GMT+0100 (Central European Standard Time),31]
1546301100: (2) [Tue Jan 01 2019 01:05:00 GMT+0100 (Central European Standard Time),30]
1546301400: (2) [Tue Jan 01 2019 01:10:00 GMT+0100 (Central European Standard Time),30]
1546301700: (2) [Tue Jan 01 2019 01:15:00 GMT+0100 (Central European Standard Time),30]
1546302000: (2) [Tue Jan 01 2019 01:20:00 GMT+0100 (Central European Standard Time),30]
1546302300: (2) [Tue Jan 01 2019 01:25:00 GMT+0100 (Central European Standard Time),30]
1546302600: (2) [Tue Jan 01 2019 01:30:00 GMT+0100 (Central European Standard Time),30]
...

我还按照错误的建议将 turboTreshold 设置为更高的数字,但它仍然不起作用(仍然发出警告):

plotOptions: {
    series: {
        turboThreshold: 500000,...
    }
}

为了更完整地理解我的代码,这里有一个 github repository(无法解决合并冲突)

解决方法

请注意 date 格式。
例如,Tue Jan 01 2019 01:00:00 GMT+0100 (Central European Standard Time)) 不是 Highcharts 的数字。它只是一个字符串。
为了解决这个问题,请使用毫秒格式的时间戳。

在那里您可能会找到一些将其从一种格式转换为另一种格式的方法。
MDN:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?