高图表的Reveal.js

Question

我使用的是reveal.js (http://lab.hakim.se/reveal-js/)和高级图表JS，但是工具提示的位置有问题。例如，如果我使用x轴上的月份行，当我将鼠标放在1月份的点上时，工具提示是ok的，但当我将鼠标放在12月份时，工具提示显示了10月份的数据。每个月的工具提示越来越多。

您可以看到http://lideria.net/presentacion/index1.php来查看问题

Answer 1

这可能是高图表的问题，我们已经报告了这里。此外，还建议使用workaround：http://jsfiddle.net/highcharts/BD3R7/

Answer 2

reveal.js用css缩放标签自动标注视图端口。如果您检查class="slides" div，您将看到如下内容：

<div class="slides" style="width: 960px; height: 700px; zoom: 0.8331428571428572;"> 

在这里，内容(图表)被缩放为正常大小的80%，如果图表超出其控制范围，就失去了正确计算位置的能力。

有了这些知识，快速堆栈溢出搜索就谈到了强迫'reveal.js` 不自动缩放内容‘的能力。

Answer 3

您必须覆盖normalize of H.Pointer.prototype (引用封装插件)。将以下代码添加到document.ready函数中(我猜，可能在其他地方工作)。原因是：

1. reveal.js在zoom>1和zoom<1时有不同的方式，例如zoom:1.25和transform:scale(0.75)。
2. 因此，当一个部分有几个图表和zoom>1时，必须通过e.pageX来调整e.chartX。 (函数(H) { H.wrap(H.Pointer.prototype，‘正常化“)，函数(进行，e) { var e= proceed.call(this，e)；var缩放= Reveal.getScale()；if(zoom>1) { var positionX = e.pageX - e.chartX；var positionY = e.pageY - e.chartY；e.chartX =Math.round(e.pageX-位准X*缩放)/zoom)；e.chartY = Math.round((e.pageY -位置Y*缩放)/zoom；}/zoom{ e.chartX =Math.round(e.chartX/缩放)；e.chartY =Math.round(e.chartY/缩放)；}返回e；}(高图)；