Question

我有一张具有以下规格的Highcharts图表。

chart: {
    zoomType: 'xy',
    panKey: 'shift',
    panning: true
}

我关心的是'panKey'。

如何将平移控制链接到“鼠标右键”而不是键盘上的“shift”键？

拿这个jsfiddle作为参考 http://jsfiddle.net/mqutcruw/23/

有些例子中注册了“点击事件”，但我不确定如何使用它。（https://jsfiddle.net/BlackLabel/Utx8g/?utm_source=website&utm_medium=embed&utm_campaign=Utx8g）

Answer 1

请参阅此实时演示：http://jsfiddle.net/kkulig/v078hLfq/

我在Highcharts核心中做了一些修改。

默认情况下，Highcharts完全忽略RMB事件。我注释掉了if对此负责的语句，并在图表上设置了rmbClicked标志。

  H.Pointer.prototype.onContainerMouseDown = function(e) {
    //if (e.button !== 2) {
    this.chart.rmbClicked = (e.button === 2); // set flag on chart - used in drag()

然后我在覆盖的drag函数中使用此标志来检查是否执行拖动或平移：

  if (!chart.rmbClicked) {
    // make a selection
  (...)
  } else { // right mouse button clicked
    // panning

最后，我禁用了上下文菜单事件：

 // disable context menu on rmb click
    H.wrap(H.Pointer.prototype, 'setDOMEvents', function(proceed) {
    proceed.call(this);
    this.chart.container.oncontextmenu = function(e) {
        return false;
    }
  });

有关修改Highcharts核心的文档页面： https://www.highcharts.com/docs/extending-highcharts/extending-highcharts

Highcharts | Chart Zoom＆amp;跨度|用LMB和Span缩放人民币

1 个答案: