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

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

鼠标位置 - 节点位置

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

相关推荐
咖啡の猫几秒前
JavaScript基础-创建对象的三种方式
开发语言·javascript·ecmascript
代码不停7 分钟前
Java二叉树题目练习
java·开发语言·数据结构
outstanding木槿18 分钟前
react中安装依赖时的问题 【集合】
前端·javascript·react.js·node.js
77tian21 分钟前
VMware中快速安装与优化Ubuntu全攻略
开发语言·ubuntu
愚润求学1 小时前
【Linux】进程间通信(一):认识管道
linux·运维·服务器·开发语言·c++·笔记
小吕学编程1 小时前
Jackson使用详解
java·javascript·数据库·json
霸王蟹1 小时前
React中useState中更新是同步的还是异步的?
前端·javascript·笔记·学习·react.js·前端框架
霸王蟹1 小时前
React Hooks 必须在组件最顶层调用的原因解析
前端·javascript·笔记·学习·react.js
珊瑚里的鱼1 小时前
【滑动窗口】LeetCode 1658题解 | 将 x 减到 0 的最小操作数
开发语言·c++·笔记·算法·leetcode·stl
晚秋大魔王1 小时前
OpenHarmony 开源鸿蒙南向开发——linux下使用make交叉编译第三方库——wget
java·linux·运维·开发语言·华为·harmonyos