OpenLayers学习笔记（十）— 动态加载JSON数据模拟航迹线

 

在openlayers 3 上，加载本地json数据，动态绘制航迹线，以飞机当前位置为地图中心，此例子是模拟DEMO

本文链接：动态加载JSON数据模拟航迹线

作者：狐狸家的鱼

GitHub：八至

前提需求

需要以JSON数据动态加载绘制飞机轨迹线，飞机图标以加载的坐标为当前实时位置，经过的坐标追加到轨迹线上，标牌始终跟随飞机移动。

简单搭建本地服务器

因为要加载本地JSON文件，可能会存在跨域问题，所以在本地搭建一个服务器来加载数据，会更加方便。

1.全局安装http-server

npm install http-server -g

右键菜单添加cmd窗口

这是题外话，只是为了打开方便，在右键菜单中加入”在此处打开命令窗口“

参考这个，步骤：

1. 随便在哪里新建一个txt文件，命名为OpenCmdHere.txt
2. 在文件中输入如下代码，并保存
3. 更改文件后缀名为reg，弹出的提示点确认
4. 双击OpenCmdHere.reg文件运行，弹出的提示点确认，修改注册表就大功告成了

Windows Registry Editor Version 5.00

[HKEY_CLASSES_ROOT\Directory\shell\OpenCmdHere]
@="在此处打开命令窗口"
"Icon"="cmd.exe"

[HKEY_CLASSES_ROOT\Directory\shell\OpenCmdHere\command]
@="cmd.exe /s /k pushd "%V""

[HKEY_CLASSES_ROOT\Directory\Background\shell\OpenCmdHere]
@="在此处打开命令窗口"
"Icon"="cmd.exe"

[HKEY_CLASSES_ROOT\Directory\Background\shell\OpenCmdHere\command]
@="cmd.exe /s /k pushd \"%V\""

[HKEY_CLASSES_ROOT\Drive\shell\OpenCmdHere]
@="在此处打开命令窗口"
"Icon"="cmd.exe"

[HKEY_CLASSES_ROOT\Drive\shell\OpenCmdHere\command]
@="cmd.exe /s /k pushd \"%V\""

[HKEY_CLASSES_ROOT\LibraryFolder\background\shell\OpenCmdHere]
@="在此处打开命令窗口"
"Icon"="cmd.exe"

[HKEY_CLASSES_ROOT\LibraryFolder\background\shell\OpenCmdHere\command]
@="cmd.exe /s /k pushd \"%V\""

启动服务器

进入map文件夹，右键打开cmd窗口，输入命令：

http-server

就像这样：