无需登录 数据私有 本地保存

鼠标轨迹记录回放 - 画布上重绘

16
0
0
0
就绪 | | | |
1.0x
|
轨迹点数: 0 时长: 0.00s 分辨率: 1200×600

常见问题与知识点

鼠标轨迹记录与回放工具广泛应用于多个场景：教学演示（录制操作步骤供学生观看）、用户体验研究（分析用户在界面上的鼠标行为）、Bug报告（精确重现问题操作路径）、设计展示（展示交互原型）、游戏辅助（记录和回放操作序列）。轨迹数据包含精确的坐标和时间戳，帮助分析和复现用户操作。

点击红色「录制」按钮（或按键盘 R 键）即可开始录制。录制过程中，在画布区域内的所有鼠标移动、点击和拖拽操作都会被精确记录。状态指示灯会变为红色闪烁，表示正在录制中。再次点击「停止」按钮结束录制，轨迹将保留在画布上供查看。

支持从 0.1倍到5倍 的广泛速度调节范围。0.1倍速适合慢放分析细微操作，5倍速适合快速浏览冗长轨迹。默认速度为1倍（原始速度）。您可以通过工具栏中的滑块实时调整回放速度，即使在回放进行中也可以动态调节，进度条支持点击跳转到任意时间点。

所有数据仅存储在浏览器内存中，不会上传到任何服务器。轨迹数据完全在您的本地设备上处理。您可以通过「导出」按钮将轨迹数据保存为JSON文件到本地磁盘，方便后续导入回放或分享给他人。关闭页面后，未导出的数据将被清除。这确保了您的隐私和数据安全。

完全支持！该工具使用Pointer Events API，统一处理鼠标和触摸输入。在手机或平板上，您可以使用手指在画布上进行触摸移动、点击和拖拽，所有操作都会被准确记录和回放。录制时画布会自动锁定触摸滚动，确保轨迹记录不受页面滚动干扰。

每条轨迹数据包含：坐标(x, y)、时间偏移(dt)、事件类型(type)。事件类型包括 move（移动）、down（按下）、up（释放）。导出格式为标准JSON，包含版本号、画布分辨率、总时长和完整轨迹点数组。JSON格式易于阅读和程序化处理，您可以自行分析或转换数据。

画布上的浅灰色网格（30px间距）帮助您精确感知坐标位置和移动距离。蓝色线条表示鼠标移动轨迹，红色圆点标记鼠标按下的位置（点击），橙色线条表示按住拖拽的轨迹。回放时，一个红色光标圆点会沿轨迹移动，模拟原始鼠标行为，已回放和未回放的轨迹清晰可辨。
🔧 相关工具