
WebGIS
文章平均质量分 67
David_SIAT
12年毕业至今一直从事GIS研究及研发和管理相关工作,具体B/S二、三维GIS项目研发。
展开
-
arcgis api for js根据定义范围选择出该范围内的图层要素的信息
这个功能比较简单,在官方的例子中也能查看到。希望对菜鸟有所帮助。具体代码:<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-s...原创 2019-11-13 19:37:40 · 1773 阅读 · 0 评论 -
arcgis api for js 实现标绘实例
这是一个很简单的一个功能,希望能给朋友们提供帮助。源码如下:<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width,us...原创 2019-11-13 19:27:18 · 953 阅读 · 1 评论 -
openlayer调用turf进行空间数据分析实例
openlayer调用turf进行空间数据分析实例turf处理的数据格式为GeoJson,所以在前端在进行空间数据分析前要将数据进行转换。本人简单实现在OL中调用Turf功能,希望能给进行前端空间数据处理及分析的朋友提供参考。具体如下:1.引入turf脚本库<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server...原创 2018-02-09 10:51:24 · 2973 阅读 · 0 评论 -
在CSS中设置id以相同字符串开头的正则表达式样式设置
在CSS中设置id以相同字符串开头的正则表达式样式设置,之前没有太多注意正则表达式在css中的应用。现在记下来希望更给需要的人提供参考。正则表达式中的一些通用规则:1 ^ 表示字符串开始位置匹配2 $表示字符串结束为止匹配3 *表示字符串任意位置匹配4 i表示字符串匹配不区分大小写5 g 表示字符串全局匹配css属性选择器与正则表达式:转载 2018-02-06 10:26:11 · 4331 阅读 · 0 评论 -
OpenLayer点击动态图标弹出提示框实例
本人变向解决由于Openlayers不支持gif和swf格式图片要素问题。希望给需要的朋友提供参考。具体如下:源代码:function TipFunc(str){ alert("告警站点==》id:" + str.split('@')[0] + " 站名:" + str.split('@')[1] + " 站类:" + str.split('@')[2]);}原创 2018-02-06 18:05:50 · 3542 阅读 · 0 评论 -
OpenLayer4地图全屏的实现
OpenLayer4地图全屏的实现第一种方式:自实现1.首先将地图容器的长宽设置成100%。2.对form 和body标签长宽设置成100%。3.对浏览器进行全屏设置。具体代码如下所示:fullextent 为全屏安全ID。 $("#fullextent").click(function () { //alert("全屏"); if ($("#fullextent...原创 2018-07-11 10:12:04 · 1069 阅读 · 0 评论 -
通过Html2Canvas对OpenLayers截图
希望对需要的朋友提供参考本人通过html2canvas对项目中使用的openlayers叠加的图层进行截图,生成图层数据。其中对地图上叠加的矢量和栅格图层的截图中矢量截图没什么问题注意添加跨域就行了。在 source属性中添加crossOrigin: 'anonymous', 即可;对栅格数据的截图要采用png格式。cldURL =“http://XXXXXX/XXXX/X...原创 2018-08-15 09:47:53 · 3310 阅读 · 0 评论 -
基于openlayers雷达图的叠加显示
本文介绍雷达拼图在 OpenLayers 上的叠加显示,雷达拼图是由中国气象局气象探测中心在《天气雷达拼图v3.0》系统中发布的,每个观测时次一幅 PNG 透明图片。对于静态图片加载,OpenLayers 提供了 ol.source.ImageStatic 来支持,可以参考官方的 demo Image Reprojection,demo 演示了图片叠加以及投影调整的具体实现。在具体实现雷达拼图的过...转载 2018-08-13 10:04:22 · 4398 阅读 · 0 评论 -
地质体剖面从构建到Web三维展示
当我们想要对地质数据在三维空间中进行空间分析,最终在web端进行展示的时候,应该怎么做呢?本文即从表格形式的钻孔数据出发,在ArcGIS三维中构建地质体以及地质体剖面,最终结合CityEngine 2012完成在Web端数据展示。1. 构建地质体1.1. 钻孔数据 现有的钻孔数据为2D的点要素,它包括了一张内容丰富的属性表,其中就有高程值字段,此外还有所属岩层名称等。如...转载 2018-09-06 10:58:02 · 4096 阅读 · 1 评论 -
openlayer实现图层点击响应功能
方法://地图Hover事件监听function ListMapHoverkFunc(){ var selectHover = new ol.interaction.Select({ condition: ol.events.condition.pointerMove }); map.addInteraction(selectHover)原创 2018-02-01 18:29:22 · 6351 阅读 · 1 评论 -
基于Openlayer获取wms服务要素信息
OL实例如下:body> div id="map" class="map">div> div id="info"> div> script> var wmsSource = new ol.source.ImageWMS({ url: 'https://ahocevar.com/geoserver/wms', pa原创 2018-02-01 18:19:44 · 4926 阅读 · 0 评论 -
openlayer4地图及图层导出图片问题小结
直接使用ol4中的地图导出功能在我们的项目中可能会存在跨域问题,导致地图不能正常的转为二进制。解决方法:1 //自定义图层中添加crossOrigin,具体如下: var tdtTerLayer = new ol.layer.Tile({ visible: true, source: new ol.source.XYZ(原创 2017-11-17 16:53:58 · 3086 阅读 · 0 评论 -
OpenLayer4叠加geojson数据增加监听事件获取该geojson数据的相关属性
1.数据准备将shp格式数据转成geojson格式,转换在线网站:http://geojson.io/#map=3/31.13/106.002.声明map代码//*************************************************************************************************************原创 2017-11-20 17:19:00 · 1301 阅读 · 1 评论 -
OpenLayers4文本上图实例
obj.drawstnm = function (st_result) { var arr = new Array(); arr = st_result.split('|'); //set staion style stnmFeatureset = new Array(); //declare img原创 2017-11-20 17:27:58 · 1453 阅读 · 0 评论 -
OpenLayers4叠加显示点
obj.drawst = function (st_result) { var arr = new Array(); arr = st_result.split('|'); //set staion style iconFeatureset = new Array(); //declare img s原创 2017-11-20 17:29:46 · 2354 阅读 · 0 评论 -
OL4叠加显示天地图地图服务之XYZ实例
1.天地图var tdtter = "http://t6.tianditu.com/DataServer?T=ter_w&x={x}&y={y}&l={z}";var tdtras = "http://t6.tianditu.com/DataServer?T=img_w&x={x}&y={y}&l={z}";var tdtrod = "http://t6.tianditu.com/Da原创 2017-11-20 17:37:49 · 2842 阅读 · 0 评论 -
OL4叠加显示天地图地图服务之WMTS实例
OL4叠加显示wmts地图服务可通过XYZ数据源格式进行加载如: var tianditu4 = new ol.layer.Tile({ title: "天地图墨卡托切片地形", source: new ol.source.XYZ({ url: 'http://t0.tiandi原创 2017-11-20 17:57:34 · 1247 阅读 · 0 评论 -
在OpenLayers4中将地图及叠加显示的图层生成图片保存到数据库方法
在调用自己发布的图层服务时注意在图层源属性中加入跨域。new ol.layer.Image({ source: new ol.source.ImageArcGISRest({ ratio: 1, params: {}, ...原创 2017-11-16 15:36:57 · 4341 阅读 · 1 评论 -
OL二三维联动实例效果
OL4二三维联动实例二三维地图联动在webGIS项目中经常使用,该文简单说明openlayers3与Cesium整合实现。效果:脚本准备:代码:init()">function init() { view = new ol.View({ center: o原创 2017-11-21 15:46:41 · 7478 阅读 · 6 评论 -
geoserver wmts服务de叠加
Flex调用geoserver发布的wmts服务图层。转载 2016-10-11 08:17:08 · 510 阅读 · 0 评论