超频化石鱼的博客

OpenLayers是一个js库，用于显示各个地图服务所提供的数据，例如ArcGIS，GeoServer等。这里结合GeoServer使用来显示地图。1. 从官网下载OpenLayers库。解压后放入web工程下。http://openlayers.org/2. 将js与css文件导入到页面中。这里版本为v5.0。<link rel="stylesheet" href="v...

OpenLayers的显示构成由外向内为：ol.Map：地图对象。 ol.layer.Vector：图层对象layer。Map含有多个layer，最终的显示效果是由多个layer叠加而成。 ol.source.Vector和ol.style.Style：一个layer由两部分构成：数据源source和样式style。其含义是，该layer下所有的图形都使用同样的绘制样式。ol.sou...

OpenLayers的点击事件是附加在整个ol.Map对象上的：var selectSingleClick = new ol.interaction.Select();map.addInteraction(selectSingleClick);selectSingleClick.on('select', function(e) { var features = e.target.get...

OpenLayers的feature有个feature.values_.data属性，可以为其附加各种自定义数据。当创建一个feature时：var myData = { value0: '文本', leftClickCallback: function(params) {}, leftClickCallbackParams: {value: 1}, rightClickCall...

对于OpenLayers的Vector图层，上面绘制了各种feature。例如绘制了一个多边形，现在希望通过鼠标来动态调整该feature的边界。OpenLayers的Interaction提供了这种功能。ol.interaction.Modify配合ol.interaction.Snap，可以实现feature的动态修改。创建：var source = layer.getSou...

view与layer都可以进行显示内容的控制。这两者负责的功能是由区别的。view即显示的地图容器，有以下几个属性：center：[经度，纬度] ，对应的设置函数为view.setCenter()。。用于设置一个地图上的点，该点将显示在view中央。 zoom：放缩等级，对应的设置函数为view.setZoom()。一个地图可以有多个放缩等级，为view设置zoom，则会将地图放缩到对应...

点击某个元素，弹出弹窗。该弹窗就是Overlay。定义一个Overlay，首先要定义一个元素作为弹窗的主体：<div id="myPopup">弹窗层 <div> 内容自定义 <button id="closeOverlay">关闭</button> </div></div>