高图缩放和x轴与字符串数组的类别

Highchart Zoom and X-Axis with String Array for Categories

本文关键字：数组 字符串 缩放 高图      更新时间：2023-09-26

我现在正在调整高图。前面，我们在带有相关日期的图上绘制了点。该图表还有maxZoom:14 * 24 * 3600000，允许用户进一步深入。

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

但是现在我有两个问题。

1)首先是它不允许我缩放，因为我将一个字符串数组作为categories传递到图表中。我希望它仍然能够缩放，即使x轴是字符串。据我所知，缩放虽然使用秒来插入x轴上的日期之间。

2)第二，当我突出显示图表上的数据点时，它们表示Invalid date，尽管我已指定图形为linear。是否有一种方法，我可以添加一个显式的值，以显示在这里突出显示(即实际日期值之前，它被转换为年季度?)

有办法解决这些问题吗?

相关代码:

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
            }]

使用标签格式化器。

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

相关文章：