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);

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

鼠标位置 - 节点位置

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

相关推荐
2501_920931704 分钟前
React Native鸿蒙跨平台使用useState管理健康记录和过滤状态,支持多种健康数据类型(血压、体重等)并实现按类型过滤功能
javascript·react native·react.js·ecmascript·harmonyos
冷雨夜中漫步7 分钟前
python反转列表reverse()和[::-1]哪个效率更高
开发语言·python
rainbow688910 分钟前
Python面向对象编程与异常处理实战
开发语言·python
Ulyanov13 分钟前
从静态到沉浸:打造惊艳的Web技术发展历程3D时间轴
前端·javascript·html5·gui开发
你撅嘴真丑32 分钟前
第八章 - 贪心法
开发语言·c++·算法
VT.馒头36 分钟前
【力扣】2625. 扁平化嵌套数组
前端·javascript·算法·leetcode·职场和发展·typescript
梵刹古音42 分钟前
【C语言】 浮点型(实型)变量
c语言·开发语言·嵌入式
历程里程碑42 分钟前
Linux 17 程序地址空间
linux·运维·服务器·开发语言·数据结构·笔记·排序算法
u0109272711 小时前
模板元编程调试方法
开发语言·c++·算法
??(lxy)1 小时前
java高性能无锁队列——MpscLinkedQueue
java·开发语言