Question

是否可以在导航器系列中使用“步骤”？正如API中所记载的那样，它应该是可能的，但由于某种原因不适合我。

我正在使用Highstock创建一个“甘特图”，我不喜欢具有多个窗格的图表的默认导航行为（默认情况下，导航器“借用”第一个系列数据）。这就是我提供导航系列数据的原因

$(function () {

    var data1 = [[1, 0, 1], [2, 0, 1], [2, null, null], [3, 0, 1], [5, 0, 1], [5, null, null], [6, 0, 1], [10, 0, 1]]
    var data2 = [[1, null, null], [2, 0, 1], [4, 0, 1], [10, null, null]]
    var dataNavigator = [[1, 1], [3, 2], [4, 1], [5, 0], [6, 1], [10, 1]]

    $('#container').highcharts('StockChart', {

        chart: {
            type: 'arearange'
        },

        xAxis : {
            ordinal: false
        },

        navigator : {
            series : {
                step: true,
                data: dataNavigator
            }
        },

        yAxis: [{
            gridLineWidth: 0,
            opposite: false,
            height: '50%',
            offset: 0,
            lineWidth: 2,
            labels: {enabled: false},
            title : {
                text: "y0"
            }
        }, {
            gridLineWidth: 0,
            opposite: false,
            top: '50%',
            height: '50%',
            offset: 0,
            lineWidth: 2,
            labels: {enabled: false},
            title : {
                text: "y1"
            }
        }],

        rangeSelector: {
            selected: 2
        },

        title: {
            text: 'Temperature variation by day'
        },

        tooltip: {
            pointFormat: '<span style="color:{point.color}">\u25CF</span> {series.name}<br/>'
        },

        series: [{
            name: 'Serie Name 1',
            data: data1,
            step: true,
            yAxis: 0
        }, {
            name: 'Serie Name 2',
            data: data2,
            step: true,
            yAxis: 1,
            id: 'series1'
        }]

    });

});

Answer 1

由于为step类型系列定义line，您必须手动定义它。此外，step的值为'left'，'right'和'center'。例如：

navigator : {
    series : {
        type: 'line',
        step: 'left',
        data: dataNavigator
    }
}

请参阅this JSFiddle demonstration的外观。

导航仪的步骤系列

1 个答案: