从本节开始,我会陆陆续续的更新有关OL3的相关文章——OpenLayers3基础教程,欢迎大家关注我的博客,同时也希望我的博客能够给大家带来一点帮助。
最近一直在考虑一件事情,那就是openlayers中自定义wms的图层控制。用过openlayers的人都知道,在openlayers中有自带的图层控制的控件,调用方法也很简单:
OpenLayers(https://openlayers.org/)是一个用来帮助开发Web地图应用的高性能的、功能丰富的JavaScript类库,可以满足几乎所有的地图开发需求。
在项目中往往使用地图作为底图(比如 天地图卫星图等),再其上覆盖你的通过geoserver发布自定义图层。本文记录了我的实现方法。
最近在做一个开源GIS的demo的工作,工作中涉及到了地图瓦片,选取的开发环境是geoserver+openlayers,那么地图瓦片自然而然也就使用geowebcache,geowebcache就相当于是openlayer和geoserver之间的中介,首先,geowebcache会根据你的配置信息,把相应的地图图层切好图,存放在磁盘中,然后在使用openlayer加载地图服务的时候,把地图服务的地址指向geowebcache,geowebcache接收到这些请求后,会根据请求的位置和比例尺在切片目录中找到对应的瓦片,然后返回给你,省去了动态生成地图的过程,速度大幅度提高,而且由于请求的图片资源是事先生成好的,浏览器加载这些图片之后,下一次再去请求同样的图片,就会从浏览器的缓存中拉去,速度进一步提高!
在使用Openlayer的时候可以npm install openlayers --save也可以使用 npm install ol --save 明显感觉前面安装特别慢。
本文案例使用 Vite 搭建项目,在 Vue 3 的基础上使用 OpenLayers 。
前段时间换了工作,从以前的 996 变成了现在的 965,周末有了一些空闲时间,于是就想着写一些文章和大家分享一下。思考了很久,最终确定了主题为前端高德地图的教程。
我们知道将GIS数据大致分成矢量数据和栅格数据(地形和三维模型都是兼具矢量和栅格数据的特性)。但是如果用来Web环境中,那么使用图片这个栅格形式的数据载体无疑是最为方便的,因为图片本身就是一种非常重要的GUI元素,使用非常广泛。另外,基于矢量的地图叫做线划图,基于栅格的地图则是影像图。这也是网络地图服务(Web Map Service,以下简称WMS)的含义,可以将传统意义上的矢量数据或者栅格数据,发布成图片形式的地图数据,供浏览器的用户使用。
使用 Vite 初始化项目并安装 ol ,更详细做法可以查看 『Vite + Vue3 + OpenLayers 起步』
在Cesium中,加载影像图层主要通过ImageryLayer、ImageryProvider和ImageryLayerCollection三个类来实现;首先我们先来认识下这三个类
在前面的章节,讲到了Arcgis for js加载天地图,在本节讲述如何在Openlayers 2.X的版本中加载天地图,并添加自己的wms服务。
用过百度地图的童鞋一定很羡慕百度地图POi的展示,地图切片+事件响应,以前一直在考虑这个问题,今天,将我的思考结果做一个汇报给大家。下面,将我的实现思路说明一下:1、当图层添加完成或者图层添加完毕并地图四至发生变化时候,从后台获取当前视野内的POI点数据;2、注册mousemove事件,根据鼠标的位置生成一个很小的矩形框,判断POI点数据是否落在了该小矩形框内,是,将其高亮。
好久不见,距离OpenLayers入门第一篇已经过了很久,为什么迟迟没有后续呢,主要有两个原因,一是因为近期项目里使用地图的部分比较少,二是因为很多时候即使功能做出来了,但是还是不能完全理解,不是很明白的东西除了贴代码之外也写不了啥,其实第一篇也是很基础很简单的,但是意外的是看的人是最多的,这让我意识到可能即使是贴一下代码对一些人也是有帮助的,这就是这一篇的主要目的,可能有一些地方会看不懂,但是不要问,问我也不知道,如果你恰好了解的话十分欢迎在评论里分享,感谢~
上文中提到了在Arcgis for JS中实现百度地图ABCD的marker效果,在本文,讲述如何在OpenLayers2中实现类似的效果。
Cesium支持加载影像图层,主要是各种地图服务。这里就通过Cesium实现添加影像地图和中文注记。
本节的内容很简单,说说Arcgis for Javascript里面map对象的addLayer方法。在for JS的API中,addLayer方法有两种,如下图:
经过一个春节的休整,今天终于开始了!不论什么时候,都不要忘记学习,学习是一辈子的事情!今天,我来说说如何实现天地图的离线以及Openlayers加载离线数据实现天地图数据的展示。
theme: smartblue 本文简介 image.png 将地图切换到不同容器里展示。 不管在地图上做任何操作,切换容器后,操作过的内容也是会同步过去。 思路 使用 ol 提供的方法可以获取 当前地图所在容器 和 设置地图到新的容器 里。 Map.getTarget() 获取当前地图所在容器 Map.setTarget() 设置地图到指定容器 编码 <template> <div id=03
在本文叙述如何在openlayers中实现鼠标经过某一对象时,对象高亮;点击某一对象时,弹出该对象的信息。重点为OpenLayers.Layer.Vector和OpenLayers.Control.SelectFeature,下面开始讲解。
你可以在OL官网去下载,下载地址为http://openlayers.org/download/,也可以去我的百度云盘下载,下载地址为http://pan.baidu.com/s/1o6wwHTo。官网上的最新版本为3.6.0,我的网盘的版本为3.0.0,不过官网上的链接好像是失效的。
cesiumjs中可定制多种图层,可以使用互联网上很多地图提供商的图层数据,也可以使用自己的地图数据。Cesium支持多种标准化格式的GIS瓦片服务,可以把栅格图层绘制到地球的表面——cesiumjs的地图图层本质上是一些瓦片数据,这些图层的亮度、对比度、色相均可以动态调整。
为方便大家下载,我将所有软件上传的百度网盘里了,有需要的可以上网盘直接下载,地址为:http://pan.baidu.com/s/1ntJrf8P,此外,openlayers的下载地址为:http://pan.baidu.com/s/1kTBTCX5。
自从换了工作就很少有时间上网了,新的单位不让上网的,所以博客也有好久没有更新了,虽然博文的质量一般般吧,但是觉得还是坚持写下去比较好,今天,北京,雨天,写点最近工作中的所得吧!
本文讲述Arcgis Image Server相关以及在OL2中如何加载Arcgis Server发布的影像服务。
前言 通过结合 HTML5 和 OpenLayers 可以组合成非常棒的一个电信地图网络拓扑图的应用,形成的效果可以用来作为电信资源管理系统,美食定位分享软件,片区找房,绘制铁轨线路等等,各个领域都能
首先,本文实现的结果图给大家展现一下: 放大的样子: 颜色是通过属性中某个字段值来分级的,可以自定义。 上面功能是用ArcGIS切片好数据,在Geoserver 中发布,并用google地图作为底图展
地图数据以海量著称,传统的做法是建立空间索引,优化查询等,这些并没有解决如何有效的组织地图数据,提高地图访问效率的问题。用GeoServer可以在用户之间迅速共享空间地理信息。
在Arcgis for js中,有一个图层FeatureLayer,能够很方便的实现点、线、面的高亮。FeatureLayer是GraphicsLayer图层的一个扩展,本文讲述如何在Openlayers中通过Vector的扩展实现FeatureLayer。
想写本文,主要是源于前两天有个老师找到我说让我录一个大概半个小时的视频,跟大家分享一下各webgis框架之间的区别以及在应用的过程中应该如何选择。其实之前也有学员问过类似的问题,当时只是针对他们的疑问做了回答。虽然各个框架都有用过,有几个还算比较熟悉,但并没有全面的对各个框架进行过比较,刚好借着这个机会,一方面重新对各个框架有一个比较全面的认识,另一方面对各个框架做一个比较,以便后面使用的时候有一个较好的选择。
homeButton 功能在实际的应用场景中很常见而且功能也很实用,该组件的主要功能是返回到系统初始化时的位置。默认是整个球的位置,如下图:
问题 在Openlayer3中直接加载PNG图片,在API中提供了ImageStatic可以将图片展示出来,但是如何设置图片的imageExtent让图片能够在地图的正确位置展示成了问题的关键。
geoserver是常用的地图服务器之一,除了基本的能力之外,也提供了很多的插件方便大家使用。在本文,讲述一下如何在geoserver中使用BlobStores和gwc-sqlite-plugin插件实现地图的切片和部署。
地理信息系统(英语:Geographic Information System,缩写:GIS)是一门综合性学科,结合地理学与地图学,已经广泛的应用在不同的领域,是用于输入、存储、查询、分析和显示地理数据的计算机系统。具体解释请参考维基百科。 虽说GIS这门学科很复杂,但是从开发层次来划分,一般分为底层开发和二次开发。GIS组件发展迅速,将底层算法进行了封装。二次开发人员只要掌握相关组件的API函数,基本能完成业务需求。
由于要在内网开发地图项目,不能访问在线的地图服务了,就想把地图瓦片下载下来,网上找了一些下载器都是需要注册及收费的,否则下载到的图都是打水印的,如下:
最近参与了一个涉及流媒体信用卡交易数据并根据风险概率对其进行分类的项目。在此基础上,想探索可视化数据的选项。决定专注于地理方面,因为它是尝试识别欺诈性交易时的关键组成部分。
Viewer 类是 cesium 的核心类,是地图可视化展示的主窗口,cesium 程序应用的切入口,它提供了基本的虚拟地球显示和众多的控制选项.
正常使用LayerSwitcherImage时,右上角的图层切换默认会显示所有图层, 有时候我们使用测量,测距等会新建Vector的要素是,图层切换功能也会拉过去,
在前面《百度地图、ECharts整合HT for Web网络拓扑图应用》我们有介绍百度地图和 HT for Web 的整合,我们今天来谈谈 OpenLayers 和 HT for Web 的整合。 HT for Web作为逻辑拓扑图形组件自身没有GIS功能,但可以与各种GIS引擎即其客户端组件进行融合,各取所长实现逻辑拓扑和物理拓扑的无缝融合,本章将具体介绍HT for Web与开发免费的OpenLayers地图结合应用的关键技术点,该文介绍的结合的原理,其实还可推广到与ArcGIS、百度地图以及Googl
因为一些缘故,工作中了解了一下 GIS。本文算是菜鸟的学习笔记吧,如有错误,衷心希望专业的 GIS 同学指正~
在实际的应用中,很多时候我们需要对展示的图层进行属性或者空间的过滤,在Geoserver发布的WMS中,可以通过CQL_FILTER来设置过滤条件,但是Arcgis Server发布的WMS不支持CQL_FILTER的过滤,这样就无法实现对展示的图层进行过滤。好在Arcgis Server的REST接口中,EXPORT接口实现了图层的导出功能,并可添加过滤条件,借于此,本文通过扩展OL2图层,结合EXPORT接口,实现Geoserver中CQL_FILTER的功能。
HT for Web作为逻辑拓扑图形组件自身没有GIS功能,但可以与各种GIS引擎即其客户端组件进行融合,各取所长实现逻辑拓扑和物理拓扑的无缝融合,本章将具体介绍HT for Web与开发免费的Ope
我是厦门大学的一名大四学生,被@iGuo抓来写关于数据可视化的系列推文,因本人水平实在有限,本系列推文相比CPP别的技术类文章肯定那么高大上和干货满满,还请各位看官海涵。
ArcGIS for Excel 是一款 Microsoft Office 加载项,可用于从 ArcGIS 向 Microsoft Excel 中添加制图功能。借助 ArcGIS for Excel,您可以创建包含 Excel 和 ArcGIS 服务数据的交互式地图,而无需离开 Excel 环境。
该文介绍了如何使用地图和图形组件库(如OpenLayers和React-Map-Gl)实现在网页上绘制中国省级区域并显示省级名称和首都信息。首先介绍了相关技术,然后描述了如何利用OpenLayers加载地图和图层,接着展示了如何通过React-Map-Gl绘制省级区域并显示相关信息。最后,介绍了如何实现点击省级区域后在OpenLayers地图上高亮显示省级名称和首都信息。
前面的有篇文章介绍了Openlayers 2.X下加载天地图,本节介绍Openlayers 2.X下加载高德地图。
在OpenLayers中加载Arcgis Server切片用XYZ图层,Arcgis Server的切片调用地址我们可以看到如下:
通过OpenLayers.Control.DrawFeature和OpenLayers.Handler.Point实现在地图上画圆心。
除了用鼠标滚轮在地图上缩放外,还可以使用 ol 提供的 api 设置地图缩放级别。
领取专属 10元无门槛券
手把手带您无忧上云