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

openlayers地图功能

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

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

openlayers官方文档学习：

OpenLayers - Quick Start

实现效果：