时间戳

首页 > 解决方案 > 当 followPointer 标志打开时，Highcharts 工具提示显示箭头/插入符号

javascript - 当 followPointer 标志打开时，Highcharts 工具提示显示箭头/插入符号

问题描述

followPointer尽管已打开，但我正在尝试让 Highcharts 笛卡尔图表在我的工具提示上显示插入符号/箭头。

阅读文档，显示插入符号的一种方法是followPointer关闭。但是，对于我的用途，如果我可以在所有情况下都使用它，那将是理想的。

我尝试在此处检查 Tooltips 的源代码以查看followPointer代码是如何实现的，也许它会告诉我是否有一个标志可以打开或关闭箭头，但似乎我找不到任何此类东西。

如果你需要，这里有一个小提琴：http: //jsfiddle.net/Malinga/oo2njkhs/2/

标签： javascripthighchartstooltip

解决方案

我在这里找到了答案

您基本上需要覆盖move在 Highcharts 中实现的方法以设置skipAnchor为false.

(function(H) {
  H.wrap(H.Tooltip.prototype, 'move', function(proceed, x, y, anchorX, anchorY) {
    var tooltip = this,
      now = tooltip.now,
      animate = tooltip.options.animation !== false && !tooltip.isHidden &&
      // When we get close to the target position, abort animation and land on the right place (#3056)
      (Math.abs(x - now.x) > 1 || Math.abs(y - now.y) > 1),
      skipAnchor = tooltip.followPointer || tooltip.len > 1;

    skipAnchor = false;

    // Get intermediate values for animation
    H.extend(now, {
      x: animate ? (2 * now.x + x) / 3 : x,
      y: animate ? (now.y + y) / 2 : y,
      anchorX: skipAnchor ? undefined : animate ? (2 * now.anchorX + anchorX) / 3 : anchorX,
      anchorY: skipAnchor ? undefined : animate ? (now.anchorY + anchorY) / 2 : anchorY
    });

    // Move to the intermediate value
    tooltip.getLabel().attr(now);


    // Run on next tick of the mouse tracker
    if (animate) {

      // Never allow two timeouts
      clearTimeout(this.tooltipTimeout);

      // Set the fixed interval ticking for the smooth tooltip
      this.tooltipTimeout = setTimeout(function() {
        // The interval function may still be running during destroy,
        // so check that the chart is really there before calling.
        if (tooltip) {
          tooltip.move(x, y, anchorX, anchorY);
        }
      }, 32);

    }
  });
}(Highcharts));

推荐阅读