javascript - 是否可以在 highcharts/highstock 中定位缩放按钮？

Question

正如标题所说，我们有一些左侧有两个 y 轴的图表，因此如果屏幕变小，则缩放按钮会与范围输入重叠。

理想情况下，我希望缩放按钮始终对齐图表的左侧（包括轴）

谢谢

我在 API 中找不到任何暗示它可能的东西http://api.highcharts.com/highstock#rangeSelector

Answer 1

默认情况下，比例重置按钮位于右侧。您可以使用此代码更改位置，例如：

...
chart: {
    zoomType: 'x, y',
    resetZoomButton: {
        position: {
            align: 'left', // right by default
            verticalAlign: 'top', 
            x: 10,
            y: 10
        },
        relativeTo: 'chart'
    }
}    
...

现场演示。

Answer 2

检查这一点：如何在 Highstock 中的自定义坐标处定位 RangeSelector / 缩放按钮

var orgHighchartsRangeSelectorPrototypeRender = Highcharts.RangeSelector.prototype.render;
Highcharts.RangeSelector.prototype.render = function (min, max) {
    orgHighchartsRangeSelectorPrototypeRender.apply(this, [min, max]);
    var leftPosition = this.chart.plotLeft,
        topPosition = this.chart.plotTop+5,
        space = 2;
    this.zoomText.attr({
        x: leftPosition,
        y: topPosition + 15
    });
    leftPosition += this.zoomText.getBBox().width;
    for (var i = 0; i < this.buttons.length; i++) {
        this.buttons[i].attr({
            x: leftPosition,
            y: topPosition 
        });
        leftPosition += this.buttons[i].width + space;
    }
};

Answer 3

我找不到任何移动按钮的选项，但您可以使用以下方法移动范围输入：

        rangeSelector: {
            inputPosition: {
                x: 100
            }
        },

http://api.highcharts.com/highstock#rangeSelector.inputPosition。

也许您可以将输入框移到左侧，或者完全删除它们？