javascript - Gnuplot:网站上嵌入的交互式 SVG 图形在缩放时显示错误的鼠标坐标

标签 javascript svg gnuplot

当您嵌入一个使用编译的 Gnuplot svg 图时 设置术语 svg 大小 600,480 鼠标 jsdir http://your.server.com/gnuplot-js-directory/ 在您的 websize 上,您可以切换显示 X 和 Y 值的坐标框。

如果您的 SVG 文件在 <embed> 中缩放或 <object>尽管标签相对于大小(600 像素 x 480 像素),但坐标已关闭并且不显示在光标旁边。

最佳答案

这是 gnuplot-js 目录中的 gnuplot_svg.js 中的错误。

找到它说的部分

p.x = evt.clientX; p.y = evt.clientY;
p = p.matrixTransform(m.inverse());

// Allow for scrollbar position (Firefox, others?)
if (typeof evt.pageX != 'undefined') {
    p.x = evt.pageX; p.y = evt.pageY;
}

并添加以下行:

if (document.documentElement.clientWidth) {
                p.x = p.x / document.documentElement.clientWidth * gnuplot_svg.plot_term_xmax;
                p.y = p.y / document.documentElement.clientHeight * gnuplot_svg.plot_term_ymax;
        } else if (window.innerWidth) {
                p.x = p.x / window.innerWidth * gnuplot_svg.plot_term_xmax;
                p.y = p.y / window.innerHeight * gnuplot_svg.plot_term_ymax;
        }

坐标框位置现在应该相对于 or 标签内 SVG 的实际大小进行缩放,并且会跟随光标。 (适用于 Chrome 和 InternetExplorer,Firefox 不报告 document.documentElement.clientWidth 但 window.innerWidth,结果应该相同。尚未测试 Safari。)

关于javascript - Gnuplot:网站上嵌入的交互式 SVG 图形在缩放时显示错误的鼠标坐标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24988765/

相关文章:

java - MVC 中有多少个 View 对象实例

javascript - 使 SVG 元素只读

osx-lion - gnuplot x11 和 OSX 10.8.2

gnuplot - 使用带有 hidpi 屏幕的 gnuplot。

javascript - 如何检查 javascript 不打开与 window.open 函数相同的窗口

即使不满足条件,if语句中的Javascript函数仍然运行

html - 我可以制作一个 svg 图像按钮吗?

math - 在 3D 空间中绘制旋转、平移的圆

javascript - 如何使用 Service Worker 识别服务器上的更新?

javascript - ES6中的Filter Object形成另一个Object