Highcharts鼠标跟踪/鼠标悬停功能在chrome上很慢但在firefox或IE中并不慢

Question

我们使用Codeigniter和PHP构建了一个webapp，它在客户端使用Highcharts库和javascript / html，并部署在IIS上。

Highcharts库在屏幕上呈现各种图表，准确地说是5。每个图表呈现的数据不超过1000行。

图表绘制得很好，但是当鼠标悬停在图表周围时，鼠标悬停在框架中显示（仅限于chrome）。请参见下图，显示鼠标跟踪造成的帧滞后。

令人惊讶的是，此行为仅在Chrome上观察到，但在IE或Firefox中没有。

任何人都可以通过建议如何克服铬上的这种糟糕的鼠标跟踪来提供帮助。 Highcharts有一个鼠标跟踪器禁用选项，但如果它被禁用，我们会松开交互功能和鼠标悬停功能。

任何帮助克服这一点或改进chrome上的鼠标悬停帧渲染都将深受赞赏。

使用Highcharts版本2.0.4，现在更新到最新版本4.0.4

工具提示代码如下，使用框和面积图的基本工具提示选项。

tooltip: {
            formatter: function() {
                        return 'The value for <b>' + this.x + '</b> is <b>' + this.y + '</b>, in series '+ this.series.name;
                       //return "hello";
             }
        }

Answer 1

发现问题，下面是修复。

我们必须在此处启用Chrome上的“禁用图层压缩”选项 chrome：// flags /＃disable_layer_squashing

P.S感谢@SebastianBochan和@HristoValkanov指导我解决问题。

Answer 2

是Webkit中的一个错误。这是官方的Chromium bug报告：

Bugs.Webkit : hover over table rows causes the whole table to repaint

这是根据Webkit的 2014-11-14 08:53:09 PST 更新修复的，如上面的故障单中所述。这是OP发布后仅两个月。

如果您仍然遇到问题，例如使用拖放（就像我一样），那么请查看此错误报告，仍然有效且未解决：

Bugs.Chromium : Drag and drop performance issue when using "position:relative" style with many cells

自2014年3月31日起一直活跃

  

预期结果是什么？

     

  
• 当拖动的对象位于单元格上方时，单元格应为红色背景。
  

     

会发生什么？

     

  

• 拖放非常慢。

  

• 细胞有时以红色显示，但几秒钟后显示。

  

• 拖动结束后半秒内光标指针不可用。