【智能巡检】智能巡检机器人 路径编辑和轨迹仿真插件

2022年4月份的时候，应一家机器人公司的要求，解决他们巡检机器人平台开发过程中碰到的一个技术点：巡检机器人路径编辑和轨迹实时定位的问题。

该插件主要有以下需求点：

1.模拟机器人实时位置，记录机器人实时轨迹

2. 支持鼠标动作：拖拽编辑任意直线或曲线路径，滑轮缩放、拖动等

3. 支持定义显示比例尺

4. 可设置轨迹中所有元素的样式（颜色，粗细，透明度等）

5. 支持设置底图

6. 支持设置点击路径或机器人时的回调函数

记得当天上午在客户公司讨论需求，下午就回去着手技术调研，晚上11点多的时候就确定了方案，并在接下来的3、4天内，做出插件的雏形，给客户演示。

客户看后觉得可行，于是再花了大约一个多礼拜，第一个可用版本就基本成型了。整个代码量大约在1万行左右（含注释）。

由于市面上没有找到可以拿来即用的代码或插件，需要全新设计和写代码，所以报价相对比较高。只是这个功能，收费就几万块了，但客户对最终实现的效果很满意！

这是当初实现的效果：
点击查看“轨迹编辑和仿真插件”演示视频
点击查看视频

这是客户展示在大屏上的效果：

后来，出于兴趣，对这个插件做了进一步的完善：支持添加或编辑任意矢量图标并设置回调，支持多条轨迹等，上面视频里就没有展示出来了。

因为已经插件化，可以使用npm进行安装使用，或者直接引用js文件即可。使用非常简单：

// 配置路径编辑器(参数configs为JSON格式配置变量）
pEditor.config(configs);

// 在div中创建路径编辑器对象
pEditor.createPath("divPath");

// 绑定轨迹数据
pEditor.bindData(pathNodes);

// 显示轨迹编辑器
pEditor.showData(showData);

有需要的朋友请关注或留言。一起讨论交流！谢谢！