小编Mar*_*ure的帖子

我正在使用RevealJS创建演示文稿,并希望合并使用D3创建的一些交互式SVG可视化.我之前已经多次没有遇到过这种情况,但这次我遇到了一些困难.经过一些调试后,我将问题跟踪到以下内容:由于某种原因,当整个事物被包装在RevealJS中时,相对于SVG的鼠标位置没有正确报告.

我的原始版本的代码使用标准的D3技术来获得鼠标位置.然而,为了简化和隔离问题,我删除了D3,现在使用vanilla Javascript来获取鼠标位置,详见StackOverflow答案.我的代码(作为stack-snippet实现)看起来像这样:

var info =  document.getElementById("info");
var svg =  document.getElementById("svg");
pt = svg.createSVGPoint();
var cursorPoint = function(evt){
  pt.x = evt.clientX; pt.y = evt.clientY;
  return pt.matrixTransform(svg.getScreenCTM().inverse());
}
svg.addEventListener('mousemove',function(evt){
  var loc = cursorPoint(evt);
  info.textContent = "(" + loc.x + ", " + loc.y +   ")";
},false);

svg {
  border: solid black 1px;
  border-radius: 8px;
}

<div id="info">pos</div>
<svg id="svg" width="300" height="200"></svg>

当我在Mac上的Firefox中的RevealJS中运行它时,我会得到非常不同的数字 - 好像坐标已被移位(-423,-321)或其他一些大的负数对.我在下面添加了一个屏幕截图来说明这一点.鼠标没有出现在屏幕截图中,但是在左上角附近,所以它应该读取类似(3,5)或类似的小值.

我假设RevealJS正在对SVG进行一些额外的转换,但我找不到它,我希望有一些RevealJS推荐的方法来处理这个问题.

RevealJS版本在这里有一个完整的(好的,实际上没有正确的)版本.它几乎与上面的stack-snippet完全相同,但包含在最小的RevealJS模板中.

更深入地研究这个问题,问题似乎发生在Firefox上,而不是发生在Chrome上.我在我1岁的Macbook Pro上运行这些程序的当前版本.我真的很喜欢一些可以在各种浏览器中运行的代码,并且肯定希望它能够在Firefox和Chrome中运行.

我可以在Mathematica中绘制和处理隐式函数吗？

例如 :-

x^3 + y^3 = 6xy

我可以绘制这样的函数吗？