javascript - 带有用于类别的字符串数组的 Highchart 缩放和 X 轴

Question

我现在正在调整 Highcharts 。以前，我们在图表上绘制了具有相关日期的点。该图表还有 maxZoom:14 * 24 * 3600000 允许用户进一步向下钻取。

现在我将日期转换为 Year + Q#。所以现在 X 轴上显示的是 2011 年第三季度，而不是 2011 年 9 月。

但现在我有两个问题。

1) 首先是它不允许我缩放，因为我将字符串数组作为 categories 传递到图表中。我希望它仍然能够缩放，即使 X 轴是字符串。据我所知，zoom though 使用秒在 X 轴上的日期之间进行插值。

2) 第二，当我突出显示图表上的数据点时，它们显示无效日期，即使我已将图表指定为线性。有没有一种方法可以添加一个显式值以在此处突出显示(即转换为年季度之前的实际日期值？)

有没有办法解决这些问题？

相关代码:

plotData=[];
var month = window.countryData.scorecards[i].month - 1;
var year = window.countryData.scorecards[i].year;
categoriesQuarters.push(year + " Q" + parseInt(month/3 + 1));
plotData.push(value);  //Value is either a number or a string, depending on the graph.
....
xAxis: {
        type: 'linear',
        categories: categoriesQuarters
        },
series: [{
                name: graphData.country,
                data: plotData
            }]

Answer 1

使用标签格式化程序来完成。

xAxis: {
    labels: {
        formatter: function() {
            var date = Highcharts.dateFormat('%Y-%m', this.value);
            date = date.split('-');
            return date[0] + " Q" + parseInt(date[1]) / 3 + 1;
        }
    }
}

demo