WebGIS入门—-OpenLayers基本操作(一)

WebGIS 天涯孤鸟 1766℃ 0评论

上一篇简单介绍了WebGIS的一些基本概念,接下来这一篇将介绍如何使用OpenLayer来加载地图,并且如何操作地图。

一、初始化地图

首先到官网http://openlayers.org/download/下载最新版本的OpenLayers,然后将ol.js和ol.css文件添加到项目中,并引入到html页面

在Html页面中定义一个容器,用于装载地图:

然后在js中来初始化地图:new ol.Map({})

参数说明:

  • 1、ol.Map:通过new ol.Map来创建地图
  • 2、target:指定容器id
  • 3、layers:地图图层组,可以有多个图层,用逗号隔开
  • 4、view:地图视图窗口
  • 5、center:设置地图中心点
  • 6、zoom:设置地图级别

运行效果如下图

二、添加地图控件

地图控件可以通过controls参数来设置,比如添加一个全屏控件:在new ol.Map的时候添加如下代码

或者通过如下方法来动态添加:

三、添加图标

有了地图之后,可以在地图上进行撒点,把感兴趣的点在地图上标记出来,OpenLayers撒点有两种方式,一个是通过添加自定义的html addOverlay(),另一种是添加地图要素addFeature().
方式一:通过addOverlay()撒点

方式二:通过addFeature()撒点

下一篇会继续介绍OpenLayers的其他操作,敬请期待。

转载请注明:猫头鹰工作室 » WebGIS入门—-OpenLayers基本操作(一)

喜欢 (2)or分享 (0)
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(3)个小伙伴在吐槽
  1. 加油加油加油
    Jerry2018-04-24 17:22 回复
  2. 南瓜一族
    龙哥哥,好棒啊
    南瓜一族2018-04-27 21:05 回复
    • 看到你们了,哈哈
      傅~2018-05-31 10:34 回复