如何更改 Angular2-HighCharts 中的时区?

How to change Time Zone in Angular2-HighCharts?

我已经储备了几天了,现在我正在尝试使用 Angular2-HighCharts 更改面积图中的 UTC 时间。我的后端 Api 返回一些时间戳,然后我将它注入图表中,每次它在 "human time" 中转换时少两个小时,我知道 highcharts 使用 UTC 时间但我目前处于 GMT+2作为奥斯陆时间。 我尝试在 SetOptions.global.timezoneOffset 中实现 "timezoneOffset" 并更改其中的值,但它并没有改变我的视图图表中的任何内容..也许我没有正确实现该值。 也许我也可以使用我电脑上的时间戳(Moment.js 库中的 getTimezoneOffset 和 Highcharts doc api 中一样,所以如果有人有想法?

这是我的 chart.ts:

  constructor(public userService3: UserService3) {


       this.options = {
        title : { text : '' },
        setOptions: ({
        global: {
            useUTC : true,
            timezoneOffset: 2 * 60
        }
        }),
        chart: {  type: 'area'},
        legend: { enabled: false },
        credits: { enabled: false },
        xAxis: { type: 'datetime',
                startOnTick: false,
                endOnTick: false,
                tickInterval: 36e5 * 2, // two hours
                },
        yAxis: { min: 0,
          max: 100 },
        plotOptions: {
          series: {
              color: '#648e59',
              fillOpacity: 0.8,
              fillColor: '#648e59',
              pointInterval: 36e5 * 2 // two hours
                      }
            },
            series: [{
              name: 'Someone1',
              data: [],
            }]
        };
    }
   saveInstance(chartInstance) {
    this.chart = chartInstance;
     console.log(chartInstance);
}

    public ngOnInit () {
    this.dataSubscription = this.userService3.getData().subscribe((data) 
=> {
      this.options.series[0].data = data.data.operating_details;
      console.log(data);
   });
}
    ngOnDestroy() {
      if (this.dataSubscription){
this.dataSubscription.unsubscribe();
}
   }

这里是 html:

      <chart [options]="options" (load)="saveInstance($event.context)">
      </chart>

您可以通过 Highcharts.setOptions() 方法更改时区偏移量 - 它是一个静态 Highcharts 函数。

docs 中有关于如何访问静态 Highcharts 方法的解释:

const Highcharts = require('highcharts');

Highcharts.setOptions({
  global: {
    timezoneOffset: 2 * 60
  }
});

@NgModule({
    ...
    imports: [
      BrowserModule, 
      ChartModule.forRoot(
        Highcharts
      )
    ],
})

示例:http://plnkr.co/edit/oRuBmb46sUdbkMAnbStX?p=preview