javascript - HighCharts 基于时间的季度数据 - xAxis 标签问题

Question

我们在网站上显示动态数据。用户可以选择不同类型的时间段，例如每月、每季度、每年、每十年等。我们的问题在于尝试在 xAxis 上清晰地显示季度数据。我们可以使用格式化程序将工具提示正确显示为“Q1 2008”。我们想让 xAxis 做类似的事情。我们部分地在那里，但我认为我在这里犯了一些粗指错误。示例在 jsFiddle 上.

我们尝试使用的代码位于 xAxis 标签 [formatter][2] 中:

xAxis: {
            alternateGridColor: '#FAFAFA',
            labels: {
                style: {
                    fontSize: '9px',
                    width: '175px'
                },
                formatter: function () {
                    var s;
                    if (Highcharts.dateFormat('%b', this.value) == 'Jan') {
                        s = s + "Q1"
                    };
                    if (Highcharts.dateFormat('%b', this.value) == 'Apr') {
                        s = s + "Q2"
                    };
                    if (Highcharts.dateFormat('%b', this.value) == 'Jul') {
                        s = s + "Q3"
                    };
                    if (Highcharts.dateFormat('%b', this.value) == 'Oct') {
                        s = s + "Q4"
                    };
                    s = s + " " + Highcharts.dateFormat('%Y', this.value);
                    return s;
                }
            },
            tickInterval: 31536000000,
            type: 'datetime'
        }

这是使用 xAxis 的日期时间类型，并在 HighCharts 下运行。如果我将 tickInterval 更改为 3 个月 (259200000)，它会变成梨形。我们期望的结果是 xAxis 具有如下条目:2007年第一季度2007年第二季度2007年第三季度2007年第四季度..2012 年第四季度

Answer 1

您可以将 tickInterval 设置为三个月

http://jsfiddle.net/yHmrZ/5/

tickInterval: 3 * 30 * 24 * 3600 * 1000,

但是当你想动态改变范围时，你应该使用 tickPostitioner