OpenLayers地图api

openlayers3学习--简介

官网https://openlayers.org/一、官方简绍：Ahigh-performance,feature-packedlibraryforallyourmappingneedsOpenLayersmakesiteasytoputadynamicmapinanywebpage.Itcandisplaymaptiles
单调的黑白灰·2020-08-15 20:31

使用geoserver+openLayers加载google地图

下载openLayers官网：http://www.openlayers.org/配置好JAVA_HOME下载地图（s
念来过倒蛋笨·2020-08-15 20:58

openlayer简介及简单使用

openlayersOpenLayers是一个用于开发WebGIS客户端的JavaScript包，最初基于BSD许可发行。
```???·2020-08-15 20:58

openlayers展示坐标点、连线并实时刷新

//指定地图的位置//声明点位信息所需变量varrouteInfos=[];varroutePopups=[];//声明连线要展示的图层(图层的添加顺序会用心覆盖效果)varvector_line;//声明地图map=newol.Map({target:'map',view:newol.View({center:ol.proj.transform([105.571776,28.874441],'E
Super特特·2020-08-15 20:47

openlayers4.6.5 实现距离量测和面积量测

目录版本：openlayers4.6.5效果图：小插曲：实现原理：完整的js代码如下（鼠标样式图标我没放上来，有需要的我给你发邮箱）：版本：openlayers4.6.5效果图：小插曲：原本使用ol官方提供的量测例子
yangniceyang·2020-08-15 20:15

Openlayers 判断图形包含点

fvarcomponets=f.geometry.components[0].components;varchangedComponents=_.map(componets,function(c){returnnewOpenLayers.Geometry.Point
yaksok·2020-08-15 20:12

openlayers鼠标移动获取地图经纬度格式化的两种方式

方式一import{format}from'ol/coordinate';importMousePositionfrom"ol/control/MousePosition.js";//鼠标获取坐标控件constmousePositionControl=newMousePosition({coordinateFormat:function(coordinate){returnformat(coord
wilson-wei·2020-08-15 20:40

openlayers 能干的事情（一）

0.用以下css可自定义控件的显示样式，其他地方均不改http://dev.openlayers.org/releases/OpenLayers-2.10/examples/custom-style.htmlp
有点猛·2020-08-15 20:07

vue中利用openlayers加载天地图

首先在vue中安装openlayes依赖，现在推荐使用ol，ol需要一个一个的引入，我嫌麻烦就直接用的openlayers，我把openlayrs定义为全局变量，下载完openlayers依赖包后，在main.js
web coder·2020-08-15 20:07

关于openlayers的参数及其他

1.分辨率分辨率=经度范围/图片宽度比如BBOX=-180,0,180,90&WIDTH=256&HEIGHT=256分辨率=（180-（-180））/256=1.406250缩放级别可以用比例尺（scale）或者分辨率（resolution）表示。比例尺——屏幕上1米代表多少地图坐标单位；分辨率——屏幕上一个像素代表多少地图坐标单位。scale=resolution*72*39.3701（1米=
有点猛·2020-08-15 20:07

openlayers3自定义事件

Ol3popupbody,#map{border:0px;margin:0px;padding:0px;padding:0px;padding:0px;width:100%;height:100%;font-size:13px;}functioninit(){varformat='image/png';varbounds=[73.4510046356223,18.1632471876417,134
leopold_2017·2020-08-15 20:34

openlayers3实现弹出框

Ol3popupbody,#map{border:0px;margin:0px;padding:0px;padding:0px;padding:0px;width:100%;height:100%;font-size:13px;}.ol-popup{display:none;position:absolute;background-color:white;-moz-box-shadow:01px4
leopold_2017·2020-08-15 20:34

Openlayers 根据坐标点画点线圆多边形

根据坐标点画点线圆多边形，代码如下GeometrytypePointLineStringPolygonCircleNoneBezier绘制绘制圆形绘制线段绘制多边形绘制单个点清除所有清除指定varcontainer=document.getElementById(‘popup’);varcontent=document.getElementById(‘popup-content’);varclos
xiejiachao·2020-08-15 20:30

OpenLayers3 学习心得（一）——体系结构

简单理了一下OL3的图层体系，目的是为了以后在开发过程中如何管理图层（添加、删除、显示控制），如何在临时图层上添加自己的要素（方便在查询、定位、绘图等功能中使用），其他的结构在本篇幅中并不涉及，从顶层至下依次介绍。1框架Ol3是一个js的类库，对象的创建、方法调用符合js标准，因此对象的调用和其他常见的js调用一致。2地图MapMap是显示地图用的，同时也是最大的容器，里面可以加载各种类型的图层，
GISerHou·2020-08-15 20:28

OpenLayers-添加Marker

在OpenLayersMap添加Marker。
韩慧兵·2020-08-15 20:56

GeoJson+Openlayers展现后台服务提供的单点、多点的元素信息，并依据条件变化元素如元素色彩、图标

【目标1】通过Openlayers展现后台服务提供的一个点的元素信息。
韩慧兵·2020-08-15 20:56

开源GIS（六）——openlayers中overlay强大功能

一、引言overlay是覆盖物的意思，主要是放置一些和地图位置相关的元素，如：infowindow、点标记、图片等，而这些覆盖物都是和html中的element等价的，通过overlay的属性element和html元素绑定同时设定坐标参数——达到将html元素放到地图上的位置，在平移缩放的时候html元素也会随着地图的移动而移动。在arcgis中也有这方面的功能（infowindow），但是很不
gis_morningsun·2020-08-15 20:23

开源GIS（十）——openlayers中加载在线标准与自定义切片

目录一、引言二、在线标准切片三、在线自定义切片四、总结一、引言加载切片底图是openlayer最经常不过的功能，这篇文章先讲述了在线arcgis切片地图的加载，让读者有个基本的认识，下一节中会详细介绍加载切片的原理。分别是加载arcgis中的标准的切图方法和自定义的切图，标准的就是arcgisonline模式，有固定的分辨率，自定义的就是suggest模式。二、在线标准切片Titlevarmap=
gis_morningsun·2020-08-15 20:23

开源GIS（七）——openlayers中单击获取要素（深度好文）

目录一、引言二、前台方法1、interaction中select方法2、map中forEachFeatureAtPixel方法三、gisserver方法1、wms中getfeatureinfo2、wfs中getfeature四、后台方法五、空间数据库方法六、总结一、引言以前在做arcgisjs开发的时候，就开始纠结单击获取要素使用哪种方法，当时是因为arcgisserver正好提供了arcgis定
gis_morningsun·2020-08-15 20:23

开源GIS（十六）——openlayers地图打印

目录一、引言二、地图打印实现三、服务端跨域设置四、总结一、引言系统地图打印是比较常用的功能，因为经常会把当前的视图作为图片保存，用于方便自己或者他人查看当前地图的情况，截图效果不是很好，直接使用openlayers
gis_morningsun·2020-08-15 20:23

开源GIS（九）——openlayers中简单要素的添加与geojson数据修改添加

目录一、引言二、简单要素点线面的添加1、创建feature2、创建style，添加source、style到layer3、添加layer到map三、WFS获取geojson数据并修改四、效果图1、添加要素2、要素修改拼接在地图另外一个位置，因为使用geoserver发布的所以可能看不到，代码仅供参考五、总结一、引言之前文章有写过如何通过WFS服务获取geojson数据，然后将整个geojson数据
gis_morningsun·2020-08-15 20:23

OpenLayers4结合setInterval函数实现简单的地图动画----以溢油粒子的漂移扩散为例

开发测试环境Chrome73OpenLayers版本：v4.4.2前言随着浏览器对图形绘制功能的支持越来越好，越来越多的可视化直接在前端进行。
wxqqq666·2020-08-15 20:51

OpenLayers imageCanvas的使用与问题解决---Canvas图层与底图图层范围不一致

前言h5画布要想进行地理坐标相关的绘图如何能保证与底图上的位置相一致呢？这个问题一定会困惑刚刚进行地理数据前端可视化的你，其实目前我有两种解决方法解决这个问题，一种将画布大小设为与浏览器视口大小一致，然后将其添加到document对象上，每当地图范围变化时重新计算画布四个角的extent.第二种方法就是今天要说的使用ol.source.ImageCanvas，这个类（目前最新版本ol已经采用ES6
wxqqq666·2020-08-15 20:51

百度地图和openlayers融合封装（二）

2018.5.7--18:55：遇到的问题，WDrawingManager中，对于百度地图部分，传入的layer如何与绘制完的overlay绑定？初始解决方案：在每一个overlay绘制完之后，将overlay绑定到layer层，然后将回调函数写在WDrawingManager,这种解决方案导致无法removeEventListener。最终解决方案：利用百度DrawingManager的over
所长别开枪似我·2020-08-15 20:50

百度地图和openlayers融合封装（三）之实战

2018.5.10--16:02地图基本元素已经完成，各部分都有demo供参考。接下来准备完成一个地图系统页面，包含图层管理，poi静态点，静态点事件（hover,click），图形绘制，范围查询等。计划先模拟900个点，分为3个类别（图层）。预计一周完成。2018.5.28--11:14这段时间忙其他事情，地图系统界面一周内完成，博客没来得及更新。附几张效果图：悬浮，点击交互：框选：圆选：定位：
所长别开枪似我·2020-08-15 20:50

百度地图和openlayers融合封装（四）之demo展示

如果你需要进行地图开发，觉的百度地图和openlayers的api文档晦涩难懂（主要是openlayers的api很难懂，百度api入门很简单），可以使用wmap。
所长别开枪似我·2020-08-15 20:50

Openlayers学习笔记——Vector Layer Style

我们了解到Vectorlayer能够完成很多工作，这节将更深入的探讨在矢量图层上怎样定制要素的外观，定制矢量要素的外观工作与control的外观定制非常相似，但是在矢量要素外观的定制上采用Style和StyleMap对象来代替CSS，由于矢量图层不使用栅格图像，我们可以用这种方式定制矢量图层。指定SVG（或者VML或Canvas）元素的样式。我们很容易通过修改默认样式文件来改变要素的样式，但是在矢
giserinchina·2020-08-15 20:46

OpenLayers中图属查询及属性过滤

varfield='Linetype';//属性名varval='DASHED';//参数值varflag=true;functioninit(){format='image/png';map=newOpenLayers.Map
绛门人·2020-08-15 20:14

Openlayers中不同投影间的转换

varlonlat=map.getLonLatFromViewPortPx(e.xy);evt_lon=lonlat.lon;evt_lat=lonlat.lat;varlonlatt1=newOpenLayers.LonLat
绛门人·2020-08-15 20:14

openlayers中获得geojson格式数据

functiongetGeoJson(layerName){//layerName="TJDG:PipePoint",varparr={REQUEST:"GetFeature",typeName:layerName,SERVICE:"WFS",version:'1.0.0',request:'GetFeature',outputFormat:"json",maxFeatures:1000};Ope
绛门人·2020-08-15 20:14

openlayers读取arcgis server发布服务

PKH_XIAN",  SERVICE:"WFS",version:"1.1.0",srsName: "EPSG:4326",maxFeatures:1000,geometryName:"Shape"};OpenLayers.loadURL
绛门人·2020-08-15 20:14

openlayers with Google maps 简单教程

转自：http://www.07net01.com/2015/07/867199.htmlwhatisopenlayeropenlayers是一个高性能、功能全面的地图库。
wpz0713·2020-08-15 20:41

OpenLayer加载常见在线地图案例

最近在学习OpenLayer，测试了几种国内在线地图服务并作出分享与大家讨论参考资料：OpenLayers3之加载天地图高德，百度，Google地图定位偏移以及坐标系转换OpenLayer基础教程OpenLayer
wo_buzhidao·2020-08-15 20:36

OpenLayer4.6.5绘制和编辑要素及获取定位点

OpenLayer4.6.5绘制和编辑要素及获取定位点使用OpenLayer4.6.5API参考资料openlayers显示点击位置的经纬度代码如下所示绘制修改要素几何类型 PointLineStringPolygonCirclevarraster
wo_buzhidao·2020-08-15 20:36

openlayer 加载天地图为地图，同时加载arcgisserver发布的wms

OpenLayersMapQuestDemohtml,body,#map{padding:0;margin:0;height:100%;width:100%;}varmap;functioninit()
wk2133·2020-08-15 20:35

Openlayers常用代码

//加载json数据http://openlayers.org/en/latest/examples/select-features.html?
123456chenliin·2020-08-15 20:35

vue中openlayers热力图,标记带文本,弹窗,绘制边界,多图片标记学习总结

首先，我也是参考网上各种大佬代码写出来的，然后根据自己需要揉到一起的例子我这用的底图因为没钱买地图下载器所以比较丑，还好我不在乎外表。。。。（因为要内网下做项目，所以在这写demo就没加载其他在线地图资源了，就放了这个特丑的自己下的。。。）热力图,标记带文本,弹窗,绘制边界,多图片标记//地图打点,弹窗,关闭弹窗(完整demo)//importMapfrom'ol/Map.js';//import
吴、柒·2020-08-15 20:47

vue中使用openlayer6同时加载高德和百度（openlayers篇）

vue中使用openlayer6同时加载高德和百度//htmlopenlayer使用到的依赖import{Map,View}from"ol";import{TileasTileLayer,VectorasVectorLayer}from"ol/layer";importXYZfrom"ol/source/XYZ";importTileImagefrom"ol/source/TileImage";i
翠莲·2020-08-15 20:46

关于使用openlayers6和leaflet同时加载高德和百度的问题记录（leaflet篇）

先说leaflet,leaflet默认使用的坐标系是EPSG:3857，百度地图：使用百度坐标系高德地图：火星坐标系（GcJ02）leaflet是默认支持GcJ02的，而且leaflet提供了这个插件L.tileLayer.chinaProvider，可以引入高德、谷歌、天地图，不用经过转化。但是百度坐标就需要进行额外的转化:代码如下（本人只是个代码搬运工~~）/***百度地图底图调用插件*@au
翠莲·2020-08-15 20:46

openlayers5+webpack4.x（热更新）配置ES6的开发环境、解决ol5的import问题

最近在学习一些开源的地图api，openlayers5，在使用的时候发现按照官网的import无法根本无法使用。这是因为import是ES6的语法。
gis_rc·2020-08-15 20:15

使用OpenLayers 3发布离线地图（百度地图）

说明：之前离线地图用谷歌地图来实现，给客户看了效果之后，客户说还不清晰，要换成清晰度高一点的，示例图如下所示：文章目录一.离线地图瓦片下载方面：二。调用离线地图瓦片方面：这个是谷歌地图11级层级清晰度：这个是百度地图11层级清晰度：其实我个人觉得吧，这两个图差别不是很大，只是百度地图对应标记的点比较多，地名也比较全，清晰度两个倒是都差不多。再要下载高清的离线地图瓦片就要花3600块钱去购买永久激活
java_codeMan·2020-08-15 20:10

使用OpenLayers根据经纬度对地图进行多个标点，以及点击标点弹框的实现（从后台数据库获取经纬度数据）

具体实现操作请参照我的另外两篇博文：使用OpenLayers发布离线地图和使用OpenLayers根据经纬度对地图进行单个标点，以及点击标点弹框的实现（没有从后台获取经纬度数据）1.拿到实际项目应用来说
java_codeMan·2020-08-15 20:10

使用OpenLayers发布离线地图（谷歌地图）

说明：本文章参照@z793837435的博文：如何使用OpenLayer发布离线地图一。下载离线地图下载器1.这里推荐的地图下载器为BIGEMAP地图下载器，点击链接下载2.下载完成后，需要进行授权操作，点击软件右上方QQ交谈加入QQ群，并私聊管理员，然后根据管理员的提示点击购买按钮，复制该授权用户号给管理员，管理员会给你免费激活，如下图所示：3.激活之后，软件左上角显示已激活。现在该软件暂时是免
java_codeMan·2020-08-15 20:10

vue中使用OpenLayers（五）：两层地图合并，地图上显示地址和区域描边

vue中使用OpenLayers（五）：两层地图合并html中需要用两个id接收jpg和png。png在jpg上面。
笑的像条狗·2020-08-15 20:09

vue中使用OpenLayers（四）：事件和取值

vue中使用OpenLayers（四）：事件和取值（一）创建地图initPointMap(){this.map=newMap({target:"mainDiv",view:newView({center
笑的像条狗·2020-08-15 20:09

vue中使用OpenLayers（三）：绘制文字叠加和相对位置的调整

vue中使用OpenLayers（三）：绘制文字叠加和相对位置的调整第一步引入需要js之前我已经引过了，现在就不引了，想知道了直接看上一章第二步letrome;rome=newFeature({data
笑的像条狗·2020-08-15 20:09

vue中使用OpenLayers（一）：引入谷歌地图

vue中使用OpenLayers（一）：引入谷歌地图第一步npminstallolpackage.json中可以看到第二步引入import"ol/ol.css";importMapfrom"ol/Map
笑的像条狗·2020-08-15 20:08

vue+openlayers添加点击事件进行图片标记

思考：首先肯定是先创建一个图层，然后在该图层点击的位置添加一个feature(图片)代码实现：//创建矢量容器，当点击时将图标feature放进去variconVector=newVectorSource({features:[]})//创建图层variconLayer=newVectorLayer({source:iconVector})//将图层添加到地图上this.map.addLayer(
迷茫的小猿·2020-08-15 20:33

openlayers地图显示中心图标

openlayers地图显示中心点openlayers地图显示中心位置，类似微信发送位置误区使用Overlay拖动地图，中心图标随地图移动而移动总结openlayers地图显示中心位置，类似微信发送位置地图使用中
weixin_43727458·2020-08-15 20:32

解决openlayers6加载百度地图出现偏移问题

1、问题ol6加载百度地图出现的问题2、原因由于openlayers6加载地图的方式是右下递增，原先是右上递增，所以在原先加载百度地图的基础之上，将tileUrlFunction中的y坐标变为原先的相反数即可
43685945·2020-08-15 20:01
上一页 35 36 37 38 39 40 41 42 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他