js 获取节点相对于屏幕的坐标位置,获取节点的宽高,获取鼠标事件回调的鼠标位置,计算鼠标相对于某个节点下的坐标

获取节点相对于屏幕的坐标位置:

document.getElementById('svgBoxId').getBoundingClientRect()

获取节点的宽高:

document.getElementById('svgBoxId').offsetWidth
document.getElementById('svgBoxId').offsetHeight

获取鼠标事件回调的鼠标位置:

javascript 复制代码
var mouseX = event.pageX;
  var mouseY = event.pageY;
  console.log('鼠标位置:', mouseX, mouseY);

计算鼠标相对于某个节点下的坐标:

鼠标位置 - 节点位置

注意:都是相对于屏幕的位置。

相关推荐
晓得迷路了4 分钟前
栗子前端技术周刊第 97 期 - Viteland:8 月回顾、Redux Toolkit 2.9、Nuxt 4.1...
前端·javascript·nuxt.js
EndingCoder8 分钟前
Electron 安全性最佳实践:防范常见漏洞
前端·javascript·electron·前端框架·node.js·桌面端
学前端搞口饭吃16 分钟前
React props的使用
前端·javascript·react.js
王伯安呢32 分钟前
Java开发环境配置入门指南
java·开发语言·jvm·eclipse·环境搭建·新手
·前路漫漫亦灿灿35 分钟前
C++-类型转换
开发语言·c++
灵感__idea39 分钟前
JavaScript高级程序设计(第5版):前端的能力边界
前端·javascript·程序员
华洛40 分钟前
SEO还没死,GEO之战已经开始
前端·javascript·产品
Kyln.Wu1 小时前
【python实用小脚本-205】[HR揭秘]手工党逐行查Bug的终结者|Python版代码质量“CT机”加速器(建议收藏)
开发语言·python·bug
计算机毕业设计木哥1 小时前
Python毕业设计推荐:基于Django的饮食计划推荐与交流分享平台 饮食健康系统 健康食谱计划系统
开发语言·hadoop·spring boot·后端·python·django·课程设计
rockmelodies1 小时前
Java安全体系深度研究:技术演进与攻防实践
java·开发语言·安全