![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
GISER_A
gis+智慧城市研究者
展开
-
button绑定多个click的bug处理
在使用onchange变化是动态绑定button的click时,偶然发现同一个button会绑定多个click,并依此执行,造成点击一次相应多次的bug。解决办法:每次绑定前先移除先前的绑定。1、原生jsfunction bodyScroll(event){ event.preventDefault();}document.body.addEventListener('原创 2017-09-29 10:18:26 · 1604 阅读 · 0 评论 -
WebStorm常用功能的使用技巧分享
现在流行VUE,也渐渐习惯使用webstorm来开发前端项目,这里记录下使用技巧。WebStorm 是 JetBrain 公司开发的一款JavaScript IDE,使用非常方便,可以使编写代码过程更加流畅。本文在这里分享一些常用功能的使用技巧,希望能帮助大家更好的使用这款强大的 JavaScript 开发工具。代码编辑代码跳转: Ctrl + 左键 或者 Ctrl + B,可以...转载 2019-07-26 16:18:51 · 461 阅读 · 0 评论 -
HTML跨域iframe父子方法互调(postMessage)
碰到了一个跨域iframe父子页面方法互调的问题,网上查了下使用H5自带的postMessage可解决问题,这里填下坑,分析下如何应用。A.html页面是父页面B.html页面是子页面1、A页面要调B页面的方法在A页面中传递参数方法如下:document.getElementById('childPage').contentWindow.postMessage({data:o...原创 2019-07-08 19:19:33 · 781 阅读 · 0 评论 -
地图权限控制——美化完善
https://blog.csdn.net/chaoyang89111/article/details/89471123中介绍了地图遮罩即地图权限控制的方法,但是比较粗糙,本文讲下美化过程。先上结果:主要是对边界线进行了美化及平滑,达到这种悬浮的效果。主要修改的代码如下:function createClip(coords, canvas,type) { for ...原创 2019-06-18 16:40:34 · 706 阅读 · 1 评论 -
jquery 图片上传预览功能的实现
效果如下,可以设置最大上传张数,可以点击放大镜预览,点击删除按钮删除,有图片的话可以加载。使用方法如下:在需要上传图片的地方插入如下html:`<p><span class="left-title">${key}:</span> <div class="form-group form-item" flex="cross:top">...原创 2019-06-04 15:31:12 · 2227 阅读 · 0 评论 -
人员走动轨迹展示——小人走动行走动画
曾想过把轨迹中人员行走做成动画效果,一直没找到好的办法,现在找到一个开源使用openlayers开发的动画,但是该动画是飞机飞行,需要稍作修改,将飞机换成小人的64向图。需要调整的部分为:1、飞机不分左右,调整为人需要做相应修改2、人员脚步切换跟向前走动速度需要匹配,不然会有些奇怪,像飘移一样。另外:1、文中的ol_ext.js是另外一个比较好用的openlayers插件。o...原创 2019-06-19 15:03:02 · 8179 阅读 · 0 评论 -
openlayers图标拖动获取坐标
本文所涉及的技术如下:openlayers加载国家天地图和浙江天地图,图标拖动获取位置,openlayers动画。效果如下:代码如下:var map;var dataResult;var app = {}; /** * @constructor * @extends {ol.interaction.Pointer} */ app....原创 2019-06-06 16:10:43 · 1675 阅读 · 0 评论 -
Vue入门系列之Vue实例详解与生命周期-非常详细
Vue的实例是Vue框架的入口,其实也就是前端的ViewModel,它包含了页面中的业务逻辑处理、数据模型等,当然它也有自己的一系列的生命周期的事件钩子,辅助我们进行对整个Vue实例生成、编译、挂着、销毁等过程进行js控制。5.1. Vue实例初始化的选项配置对象详解前面我们已经用了很多次new Vue({...})的代码,而且Vue初始化的选项都已经用了data、methods、el、...转载 2019-05-23 14:33:29 · 187 阅读 · 0 评论 -
js中数组的splice、slice、shift、pop、unshift、push方法对比
看标题就有点懵,这些全是JavaScript操作数组的方法,又有相似性。splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。该方法会改变原始数组。arrayObject.splice(index,howmany,item1,.....,itemX)参数 描述 index 必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。...原创 2019-04-19 14:51:33 · 2003 阅读 · 0 评论 -
ArcGIS API for Javascript 空间查询分析
http://localhost:6080/arcgis/rest/services/beijing/beijingbujian/MapServer/88/query?where=1=1&geometry=118.39499,29.1328&geometryType=esriGeometryPoint&spatialRel=esriSpatialRelWithin&...原创 2019-04-23 16:37:22 · 953 阅读 · 0 评论 -
地图权限控制——只显示特定用户权限的地图区域,遮罩其他区域
这篇博客对该功能进行了美化。项目中有时候需要突出显示(或者只显示)需要的区域,遮罩其他不需要的区域,这就是经常遇到的地图权限问题,如下图所示:只用openlayers是无法解决的,需要配合H5中的canvas来实现。 var bianjieSource=new ol.source.Vector({ features: (new ol.format.G...原创 2019-04-23 13:59:14 · 2928 阅读 · 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 · 4528 阅读 · 0 评论 -
css:hover状态改变另一个元素样式的使用
例如有如下dom结构: <div id="mapDiv" class="hescgis_map"> <div id=buttonDiv><span id="buttonFlag" ></span> <button id="buttonOnMap&qu原创 2018-09-20 10:26:02 · 20342 阅读 · 0 评论 -
基于GeoServer切片地图服务的发布
关于GeoServer发布切片服务,很多帖子里都写了如何发布切片,这里不再赘述,详见基于GeoServer切片地图服务的发布。GeoServer发布的WMTS切片服务怎么调用呢?找了很多文章没找到,自己试了下http://localhost:8080/geoserver/gwc/service/wmts?layer=maoji:maoji&style=&tilematrix...原创 2018-09-19 13:43:45 · 753 阅读 · 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 · 6653 阅读 · 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 · 797 阅读 · 0 评论 -
unexpected Use of undefined Variable (no-undefined)
/*eslint no-undefined: "error"*/var foo = undefined;var undefined = "foo";if (foo === undefined) { // ...}function foo(undefined) { // ...}当做这种判断时会报标题中的错误, 因为undefined可以为重写, 所...原创 2019-08-20 10:29:16 · 2063 阅读 · 0 评论