Question

我正在使用Highstock来显示我的Web应用程序的一些数据。

数据显示为步骤（即一个值保持到新值接管），但Highstock的导航器似乎在数据上使用样条算法。我希望它像主图一样显示为“块”。

我尝试在选项中添加步骤：“true”到navigator.series，但似乎并不重要。

有没有人知道使用Highstock API执行此操作的方法？我一直在挖掘文档一段时间没有任何运气。

用于初始化highstock图表的代码：

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


    rangeSelector: {
        inputEnabled: true,
        selected: 0,
        buttons: [{
            type: 'day',
            count: 1,
            text: 'Day'
        }, {
            type: 'week',
            count: 1,
            text: 'Week'
        }]

    },

    series: [{
        name: 'Light level',
        data: data,
        type: 'area',
        step: true,
        threshold: null,
        tooltip: {
            valueDecimals: 2
        },
        fillColor: {
            linearGradient: {
                x1: 0,
                y1: 0,
                x2: 0,
                y2: 1
            },
            stops: [
                [0, "#fff800"],
                [1, Highcharts.Color("#fff800").setOpacity(0).get('rgba')]
            ]
        }
    }],

    yAxis: {
        labels: {
            formatter: function () {
                if (this.value > 0) return "" + this.value + "%";
                return "";
            }
        },
        plotLines: [{
            value: 0,
            color: 'green',
            dashStyle: 'shortdash',
            width: 2,
            label: {
                text: '0%',
                align: "right"
            }
        }, {
            value: 100,
            color: 'red',
            dashStyle: 'shortdash',
            width: 2,
            label: {
                text: '100%',
                align: "right"
            }
        }],
        tickPositions: [0, 25, 50, 75, 100]
    },
    credits: {
        enabled: false
    },
    navigator: {
        //enabled: false
    }
});

我还创建了一个带示例数据的jsfiddle。 http://jsfiddle.net/EJZ5x/

Answer 1

根据docs - step选项不受支持。

但是，当您直接为导航器设置type时，它可以正常工作！请参阅：http://jsfiddle.net/EJZ5x/1/

    navigator: {
        series: {
            type: 'area',
            step: 'left' 
        }
    }

Highstock导航器步骤像父图表

1 个答案: