Question

我正在尝试在AmCharts 4中制作一个简单的图形，其中所有时间都必须使用UTC，但是该图形以及DateAxis和光标工具提示中显示的时间都是错误的，尤其是在夏令时更改的情况下（例如，2018年10月28日）。

https://i.stack.imgur.com/yxddi.png

请注意，我的时区是布鲁塞尔，所以对您来说可能会有所不同。

我制作了一个Codepen来显示问题：https://codepen.io/Benjamin-Mampaey/pen/NoPLyd

var data = [
    {'date': '2018-10-28T00:00:00Z', 'value': 0},
    {'date': '2018-10-28T00:30:00Z', 'value': 0.5},
    {'date': '2018-10-28T01:00:00Z', 'value': 1},
    {'date': '2018-10-28T01:30:00Z', 'value': 1.5},
    {'date': '2018-10-28T02:00:00Z', 'value': 2},
    {'date': '2018-10-28T02:30:00Z', 'value': 2.5},
    {'date': '2018-10-28T03:00:00Z', 'value': 3},
    {'date': '2018-10-28T03:30:00Z', 'value': 3.5},
    {'date': '2018-10-28T04:00:00Z', 'value': 4},
    {'date': '2018-10-28T04:30:00Z', 'value': 4.5},
];

var config = {
    "type": "XYChart",
    "data": data,
    "xAxes": [{
        "type": "DateAxis",
        "tooltipDateFormat": "i",
        "dateFormats": {
            "minute": "HH:mm:ss Z",
            "hour": "HH:mm:ss Z",
        },
        "periodChangeDateFormats": {
            "minute": "i",
            "hour": "i",
        },
        "renderer": {
            "labels": {
                "rotation": 90,
                "verticalCenter": "middle",
                "horizontalCenter": "left"
            }
        },
    }],
    "yAxes": [{
        "type": "ValueAxis",
        "renderer": {
            "minGridDistance": 10
        },
    }],
    "series": [{
        "type": "LineSeries",
        "dataFields": {
            "dateX": "date",
            "valueY": "value"
        },
        "bullets":[{
            "type": "CircleBullet",
        }],
        "tooltipText": "{dateX.formatDate('i')}\n{dateX.formatDate('HH:mm:ss Z')}",
    }],
    "dateFormatter": {
        "inputDateFormat": "i",
    },
    "cursor": {
    },
};

var chart = am4core.createFromConfig(config, "chartdiv");

我看到的问题是：

该图在夏时制时产生奇怪的锯齿形变化。我希望图形是一条直线。
格式化为“ HH：mm：ss Z”的DateAxis标签不在UTC中
系列工具提示文本的提示

在AmCharts 3中，只需要设置AmCharts.useUTC = true即可工作，但是在AmCharts 4中，我不知道如何做同样的事情。我尝试在dateFormatter上设置“ utc：true”，但它没有任何改变。

Answer 1

在amcharts4上执行此操作的文档在这里： https://www.amcharts.com/docs/v4/reference/dateformatter/#utc_property

dateformatter上有一个称为utc的属性

Answer 2

我已经在github上发布了问题，他们正在调查中。

https://github.com/amcharts/amcharts4/issues/908

https://github.com/amcharts/amcharts4/issues/903

如何在AmCharts 4中正确显示UTC时间

2 个答案: