Highcharts：显示前的工具提示延迟

问题描述：

在我的highchart上，我需要延迟显示系列工具提示之前。Highcharts：显示前的工具提示延迟

我用定时器定义了一个新的刷新函数来实现它。如果计时器准备就绪，我检查鼠标位置。如果移动的不是那么多，则应该出现工具提示。

function (H) { 
       var timer = []; 
       var mousePosition = { 
        x: 0, 
        y: 0 
       }; 

       window.addEventListener("mousemove", function (event) { 
        mousePosition.x = event.pageX; 
        mousePosition.y = event.pageY; 
       }); 

       var getMousePositionX = function() { 
        return mousePosition.x; 
       }; 

       var clearTimer = function() { 
        timer = []; 
       } 

       H.wrap(H.Tooltip.prototype, 'refresh', function (proceed) { 
        var mousePosX = getMousePositionX(); 
        var delayForDisplay = this.chart.options.tooltip.delayForDisplay ? this.chart.options.tooltip.delayForDisplay : 1000; 
        timer[timer.length+1] = window.setTimeout(function() { 
         var currMousePosX = getMousePositionX(); 
         if ((mousePosX >= currMousePosX - 5 && mousePosX <= currMousePosX + 5)) { 
          this.proceed.apply(this.tooltip, this.refreshArguments); 
          clearTimer(); 
         } 
        }.bind({ 
         refreshArguments: Array.prototype.slice.call(arguments, 1), 
         chart: this.chart, 
         tooltip: this, 
         clearTimer: clearTimer, 
         proceed: proceed 
        }), delayForDisplay); 
       }); 
      };

我的问题是，悬停holos也有延迟。

这里有一个例子：JSFiddle

此问题的任何解决方案？

我希望这例子可以帮助你解决你的问题：http://jsfiddle.net/az39das8/ –

@GrzegorzBlachliński：这正是我所期待的。你真了不起:) – 1337

很高兴看到我的想法为你工作。我已经发布它作为回答:) –

答

可以使新的工具提示此基础上你的标准Highcharts提示，并显示在一些超时您的鼠标悬停：

load: function() { 
    chart = this; 
    this.myTooltip = new Highcharts.Tooltip(this, this.options.tooltip); 
    this.tooltip.label.element.remove(); 
} 


    point: { 
     events: { 
     mouseOver: function(e) { 
      var i = this.x; 
      points = []; 
      Highcharts.each(this.series.chart.series, function(s) { 
      Highcharts.each(s.data, function(p) { 
       if (p.x === i) { 
       points.push(p) 
       } 
      }) 
      }); 
      myTooltip = chart.myTooltip; 
      setTimeout(function() { 
      myTooltip.refresh(points, e) 
      }, 1000) 

     }, mouseOut: function() { 
     setTimeout(function() { 
     chart.myTooltip.hide(); 
      }, 1000) 
     } 
     } 
    }

在这里你可以看到一个例子，如何它可以工作：http://jsfiddle.net/az39das8/

Highcharts：显示前的工具提示延迟

相关推荐