我想将一个图表配置为具有不同的时区(例如,我在utc+00,并希望在utc+01显示数据)有办法吗?根据文档,我必须返回一个moment对象,然后根据moment全局区域设置显示日期。
qc6wkl3g1#
在时间配置选项中,指定parser作为函数:
parser
scales: { xAxes: [{ type: 'time', time: { unit: 'hour', min: minDate, max: maxDate, displayFormats: { hour: 'HH' }, parser: function (utcMoment) { return utcMoment.utcOffset('+0100'); } } }]
除了转换图表值外,这也适用于x轴的最小值/最大值。这假定您的最小值/最大值和标签数组中填充了力矩对象。如果处理日期对象,则函数首先需要将日期转换为时刻。
parser: function(date) { return moment(date).utcOffset('+0100'); }
nle07wnf2#
我在ticks函数上使用回调函数。这样你就只改变了标签。
import Moment from 'moment'; //... const options = { scales: { xAxes: [{ type: 'time', ticks: { callback: (label, index, ticks) => { const format = 'DD HH'; // Change how you please return new Moment(ticks[index].value) .utcOffset(this.timeZoneOffsetSeconds / 60) .format(format); } } }] }, // other options removed for clarity }; this.chart = new Chart(chartElem, { options: options, // other parameters removed for clarity });
示例注解:Moment被弃用了,显然有更好的库在那里,但这是我在我的代码库,所以...
2条答案
按热度按时间qc6wkl3g1#
在时间配置选项中,指定
parser
作为函数:除了转换图表值外,这也适用于x轴的最小值/最大值。
这假定您的最小值/最大值和标签数组中填充了力矩对象。如果处理日期对象,则函数首先需要将日期转换为时刻。
nle07wnf2#
我在ticks函数上使用回调函数。这样你就只改变了标签。
示例注解:Moment被弃用了,显然有更好的库在那里,但这是我在我的代码库,所以...