Question

我试图在一个柱形图中表示大量数据。

这是一个简单的例子：（JSFiddle）

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'column'
        },
        xAxis: {
            categories: ['test A1','test B1','test C1','test D1','test E1','test F1','test G1','test H1','test I1','test J1','test K1','test L1','test M1','test N1','test O1','test P1','test Q1','test R1','test S1','test T1','test U1','test V1','test W1','test X1','test Y1','test Z1','test A2','test B2','test C2','test D2','test E2','test F2','test G2','test H2','test I2','test J2','test K2','test L2','test M2','test N2','test O2','test P2','test Q2','test R2','test S2','test T2','test U2','test V2','test W2','test X2','test Y2','test Z2']
        },

        series: [{
            data: [299, 715, 1064, 1292, 1440, 1760, 1356, 1485, 2164, 1941, 956, 544, 299, 715, 1064, 1292, 1440, 1760, 1356, 1485, 2164, 1941, 956, 544, 948, 458, 299, 715, 1064, 1292, 1440, 1760, 1356, 1485, 2164, 1941, 956, 544, 299, 715, 1064, 1292, 1440, 1760, 1356, 1485, 2164, 1941, 956, 544, 948, 458]
        }]

    });
    // set default zoom (10 items) : COMMENT IT TO SEE THE FULL CHART
    $('#container').highcharts().xAxis[0].setExtremes(0,9);
});

如果删除默认缩放，则显示会中断。

我看到了Highstock的rangeSelector功能，这很不错，但我的X轴不是基于时间的（而且我还买不起其他许可证）。

有没有办法在我的图表上实现向左或向右拖动（一种导航）？

Answer 1

这适用于chart.panKey。这将让您按住Shift键并在x轴上拖动鼠标。查看更新后的jsFiddle。基本用法：

...
    chart: {
        type: 'column',
        panning: true,
        panKey: 'shift'
    },
...

Highcharts - 拖动以在xAxis上移动

1 个答案: