javascript - Highcharts |图表缩放和跨度 |使用 LMB 进行缩放，使用人民币进行跨度

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 完全忽略人民币事件。我注释掉了负责此操作的 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