openlayers
GISER_A
gis+智慧城市研究者
展开
-
使用openlayers 3 在线加载天地图及GeoServer发布的地图
之前试了openlayers2加载天地图,不过公司已经弃用2,所以使用openlayers3来加载天地图卫星图和标注图层,今天又学习了GeoServer发布地图,一并用openlayers测试加载出来,顺便实现了7种地图控件。下面直接贴代码: OpenLayers MapQuest Demo html, body,原创 2017-09-05 18:31:14 · 3243 阅读 · 3 评论 -
openlayers热力图
直接上代码:<!DOCTYPE html><html><head><title>Earthquakes heatmap</title><script src="js/jquery.js"></script><link rel="js/ol.css" type="text/css">...原创 2019-06-11 09:26:26 · 7521 阅读 · 0 评论 -
人员走动轨迹展示——小人走动行走动画
曾想过把轨迹中人员行走做成动画效果,一直没找到好的办法,现在找到一个开源使用openlayers开发的动画,但是该动画是飞机飞行,需要稍作修改,将飞机换成小人的64向图。需要调整的部分为:1、飞机不分左右,调整为人需要做相应修改2、人员脚步切换跟向前走动速度需要匹配,不然会有些奇怪,像飘移一样。另外:1、文中的ol_ext.js是另外一个比较好用的openlayers插件。o...原创 2019-06-19 15:03:02 · 8201 阅读 · 0 评论 -
openlayers图标拖动获取坐标
本文所涉及的技术如下:openlayers加载国家天地图和浙江天地图,图标拖动获取位置,openlayers动画。效果如下:代码如下:var map;var dataResult;var app = {}; /** * @constructor * @extends {ol.interaction.Pointer} */ app....原创 2019-06-06 16:10:43 · 1691 阅读 · 0 评论 -
记录openlayers遇到的坑——openlayers聚类cluster无法显示
今日发现有些点位不使用cluster时可以显示点位,但是使用cluster,却不能显示聚类,后来发现是因为坐标取得是字符串形式。在openlayers中加载点位的时候字符串也可以,但是聚类中不可以!所以尽量读取坐标时使用number,不要使用string类型。...原创 2019-05-31 14:19:06 · 2289 阅读 · 5 评论 -
记录openlayers遇到的坑——openlayers4.X无法正确加载比例尺
首先,这确实是openlayers4.X的bug。ol.js 461行删除了"degrees"!=e&&(b*=d.Bc())即可,这不是完美解决方案,只适用于经纬度系统。原创 2019-05-09 13:28:09 · 596 阅读 · 0 评论 -
记录openlayers遇到的坑——有岛区域无法添加地名
添加边界线的styleFunction代码如下,完全没问题。var styleFunction = function(feature, resolution) { var name=feature.get('name'); var color='rgba(32, 48, 103, 0.3)'; var areaLineStyle = new ol.style.Style({...原创 2019-04-28 09:53:29 · 435 阅读 · 0 评论 -
地图权限控制——只显示特定用户权限的地图区域,遮罩其他区域
这篇博客对该功能进行了美化。项目中有时候需要突出显示(或者只显示)需要的区域,遮罩其他不需要的区域,这就是经常遇到的地图权限问题,如下图所示:只用openlayers是无法解决的,需要配合H5中的canvas来实现。 var bianjieSource=new ol.source.Vector({ features: (new ol.format.G...原创 2019-04-23 13:59:14 · 2939 阅读 · 0 评论 -
使用openlayers进行空间分析的方法——JSTS库的应用
查看openlayers文档可以发现,openlayers中进行缓冲区分析的方法只有一个,这个方法只适合扩展矩形缓冲区,如果想扩展任意形状的缓冲区则需要用到JSTS。ol.extent.buffer(extent, value, opt_extent)例如下面的例子实现了对点【0,0】扩展缓冲区var pointFeature = new ol.Feature(new ol.ge...原创 2019-03-26 10:33:51 · 4545 阅读 · 0 评论 -
地图使用过程中的各种跨域问题解决方案
当你需要加载地图,或者需要使用地图的某些功能时,是不是会出现如下的报错信息?1、跨域Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.2、画布污染Uncaught DOMException: Failed to ex...原创 2018-09-13 15:00:39 · 6718 阅读 · 0 评论 -
加载地图时需要固定缩放到某级时的解决办法
如果需要地图从17级放大到18级触发事件:var zoomout=0;调用zoomstart事件{if(map.level==17){zoomout=17;}}然后调用zoomend事件{if(map.level==18&&zoomout==17){调用某事件;zoomout=0;}} 同理可处理需要地图从18级缩小到17级时的触发事件。...原创 2018-04-12 09:46:36 · 803 阅读 · 0 评论 -
openlayers3 气泡框展示鼠标点击坐标
根据这篇文章改写而来,主要实现了在地图上点击弹出气泡框,用来展示经纬度,当然你也可以改成展示其他内容。 OpenLayers MapQuest Demo html, body, #map{ padding:0; margin:0;原创 2017-09-06 18:26:45 · 3263 阅读 · 0 评论 -
地图权限控制——美化完善
https://blog.csdn.net/chaoyang89111/article/details/89471123中介绍了地图遮罩即地图权限控制的方法,但是比较粗糙,本文讲下美化过程。先上结果:主要是对边界线进行了美化及平滑,达到这种悬浮的效果。主要修改的代码如下:function createClip(coords, canvas,type) { for ...原创 2019-06-18 16:40:34 · 711 阅读 · 1 评论