vue后台系统管理项目-openlayers地图定位、港口数据标记功能

openlayers地图功能

• 使用openlayers开发实现查找的货源在地图的显示标注，点击货源图标进行当前港口信息显示；
• 通过查询的港口列表数据，点击当前港口在地图定位显示，添加港口选中标记功能；

• OpenLayers 是一个专为Web GIS 客户端开发提供的JavaScript 类库包，用于实现标准格式发布的地图数据访问。 
• OpenLayers是一个用于开发WebGIS客户端的JavaScript包。
• 在操作方面，OpenLayers 除了可以在浏览器中帮助开发者实现地图浏览的基本效果，比如放大（Zoom In）、缩小（Zoom Out）、平移（Pan）等常用操作之外，还可以进行选取面、选取线、要素选择、图层叠加等不同的操作，甚至可以对已有的OpenLayers 操作和数据支持类型进行扩充，为其赋予更多的功能。

• openlayers官方文档学习：

  OpenLayers - Quick Start

 实现效果：

目录

channelMap.vue页面

接口引入

 openlayers地图资源引入

data数据定义

methods方法集合

created加载