Vue2+OpenLayers动态绘制两个经纬度并计算距离(提供Gitee源码)

目录

一、案例截图

二、安装OpenLayers库

三、代码实现

3.1、初始化变量

3.2、开始/结束绘制

3.3、计算两点距离 

3.4、添加文本标注

3.5、添加点

3.6、添加线

3.7、初始化地图点击事件

3.8、加载地图

3.9、完整代码

四、Gitee源码


一、案例截图

二、安装OpenLayers库

npm install ol

三、代码实现

页面代码如下: