我试图仅在启用了导航器的情况下使用x轴缩放来控制highstock图表上“缩放”按钮的可见性。

默认情况下,此组合的核心代码会禁用缩放按钮。但是,有些功能允许您显示按钮,但是我找不到隐藏它的功能。

function createChart() {
    $('#container').highcharts('StockChart', {
        chart: {
            zoomType: "x",
            panning: true,
            panKey: "shift"
        },
        rangeSelector: {
            selected: 4
        },
        xAxis: {
            events: {
                setExtremes: xAxisExtremes
            },
        },
        yAxis: {
            labels: {
                formatter: function() {
                    return (this.value > 0 ? ' + ' : '') + this.value + '%';
                }
            },
            plotLines: [{
                value: 0,
                width: 2,
                color: 'silver'
            }]
        },
        series: seriesOptions
    });
}

function xAxisExtremes(e) {
    var chart = $('#container').highcharts();

    if (e.trigger === "zoom") {
        if (e.min && e.max) {
            chart.showResetZoom();
        } else {
            alert("Reset Zoom");
            // chart.hideResetZoom(); ????
        }
    }
}


有关我正在使用的示例,请参见此小提琴。
https://jsfiddle.net/sooftcL7/3/

进入xAxis setExtremes事件,可以使用触发器标识符检测发生的缩放事件。我可以使用chart.showResetZoom()来打开按钮。

我都尝试过

chart.resetZoomButton.destroy()
chart.resetZoomButton.hide()


如其他地方所建议,但是它们不是定义的功能。

任何帮助,将不胜感激。

干杯,

D.

最佳答案

您必须禁用导航器才能删除底部栏,并且必须禁用rangeSelector才能删除缩放按钮

$('#container').highcharts('StockChart', {
    ...
    rangeSelector : {
        enabled: false
    },
    navigator: {
        enabled: false
    }
    ...
});


检查这个
http://jsfiddle.net/CgAnW/

关于javascript - Highcharts 重置缩放按钮,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/38260579/

10-10 10:51
查看更多