如何定位范围选择器/缩放按钮在自定义坐标在Highstock

Question

我正在使用高股票图表，希望将缩放按钮(1米，2米等)移动到不同的位置。

我检查了他们的API，目前似乎没有这样做的选项。此外，源代码表明此位置是硬编码的，因此我认为我不能使用一些未记录的属性

轻松注入位置。

Hilitock来源

Highcharts.RangeSelector.prototype.render = function (min, max) {
...
rangeSelector.zoomText = renderer.text(lang.rangeSelectorZoom, plotLeft, chart.plotTop - 10)
                .css(options.labelStyle)
                .add();
// button starting position
buttonLeft = plotLeft + rangeSelector.zoomText.getBBox().width + 5;
...
}

Answer 1

这可以通过重写当前的渲染方法来实现，然后在调用实际的渲染方法后将这些框移动到所需的位置

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;
    }
};

这段代码需要在创建任何图表

之前运行

定位缩放按钮| Highchart &Hilitock @ jsFiddle

Answer 2

目前还不可能，但您可以在这里为它发出声音http://highcharts.uservoice.com/forums/55896-general/suggestions/2436599-add-ability-to-change-rangeselector-position