openlayers3

OpenLayers3加载离线百度地图(百度迁徙底图)

关于openlayers加载离线百度地图的东东好几年前就做过了，不过当时做的是2.0版本的。自从好久没有去做可视化分析之后，也很少接触这些前端的JS的东西了。最近想实现一个东西的时候，才想起需要用到一些比较干净的底图。于是刚好选用了百度迁徙后面的底图。由于百度的JS包东西太多，需要的东西太复杂，于是就选用openlayers来进行测试。果然还是非常流畅。varprojection=ol.proj.
sparkexpert·2020-08-15 19:56

Openlayers学习入门

Openlayers学习入门参考资料：http://weilin.me1.在同一个界面动态交换地图OpenLayers3地图示例地图1地图2//创建地图varmap1=newol.Map({controls
sjp8497697·2020-08-15 19:52

openlayers3—地图图层数据来源（ol.source）

ol.source.BingMaps,必应地图的数据；ol.source.Cluster,聚族矢量数据；ol.source.ImageCanvas,数据来源是一个canvas元素，其中数据是图片；ol.source.ImageMapGuide,Mapguide服务器提供的图片地图数据；ol.source.ImageStatic,提供单一的静态图片地图；ol.source.ImageVector,数
静静的路过·2020-08-15 19:48

openlayers 3 实现车辆轨迹回放

先上效果：利用openlayers3地图的postcompose事件监听地图的重绘注意：此代码是我在Vue的methods里面写的测试方法，并不能直接运行，请在理解的基础上测试。
带着天使反上帝 - Kaybee·2020-08-15 19:17

Geoserver+Openlayers3加载瓦片地图

本文将介绍如何使用Geoserver+Openlayers3加载瓦片地图。首先进行Geoserver上的配置。
shezili·2020-08-15 19:43

OpenLayers3 地图图层(Layers) 详解

在OpenLayers中，图层是使用layer对象表示的，主要有热度图层(heatmaplayer)、图片图层(imagelayer)、切片图层(tilelayer)和矢量图层(vectorlayer)四种类型，它们都是继承Layer类的。1、Layer类OpenLayers初始化一幅地图(map)，至少需要一个可视区域(view)，一个或多个图层(layer)，和一个地图加载的目标HTML标签(
何木木·2020-08-15 19:25

openlayers3 使用百度离线瓦片地图 将百度经纬度坐标转换为墨卡托坐标（ESPG:3857）

1.创建百度地图的数据源（以下是添加百度图层的部分代码）2.百度地图官网坐标拾取系统地址http://api.map.baidu.com/lbsapi/getpoint/index.html3.百度经纬度坐标系、墨卡托坐标系、国际坐标系、火星坐标系之间的相互转换https://blog.csdn.net/doulejian/article/details/701550804.根据以上Java版本改
liuk_03·2020-08-15 19:28

openlayer3 入门知识点

简介：OpenLayers3简称ol3，它是一个开源的WebGIS引擎，使用了JavaScript、最新的HTML5技术及CSS技术，支持dom，canvas和webgl三种渲染方式。
静水流深之鑫·2020-08-15 19:23

关于openlayers3多边形区域绘制以及地图/区域鼠标右键菜单功能

关于openlayers3多边形区域绘制以及地图/区域鼠标右键菜单功能主要实现功能，在地图上绘制一块多边形区域，鼠标在地图普通区域或者在图形区域点击右键分别展示不同的菜单功能。
最帅的那个好像不是我·2020-08-15 19:22

Openlayers3 API中的几处坐标系，分别代表的含义总结

在openlayer中引入切片，添加各种服务，视角的定义等情况下都有对projection的属性进行设置，有的是默认值，有的需要自定义，但是他们与请求的服务之间或多或少存在着千丝万缕的联系。或者互不影响。本人在实践过程中，对经常出现的几个projection的理解进行了总结，直接看代码：dzjgeoServerwmsservice//加载geoserver的wms服务，注意坐标系,这里虽然加载的是
逸然健在·2020-08-15 19:16

OpenLayers 3 之 添加地图网格

在OpenLayers3中，渲染网格的类是“ol.Graticule”。本文中，我结合实例，讲解“ol.Graticule”的用法和具体实现。
庆祝亚运会·2020-08-15 19:04

OpenLayers 3 之 绘制图形（ol.interaction.Draw）详解

这次我们看看怎么利用OpenLayers3绘制各种各样的图形，并添加到图层显示。在OpenLayers3中负责绘制任务的是ol.interaction.Draw类，下面介绍这个类和功能的用法。
庆祝亚运会·2020-08-15 19:04

OpenLayers 3 之 绘制图形（ol.interaction.Draw）原理解析

在OpenLayers3中，负责交互的模块中，有一个负责绘制图形的交互模块，这个交互子模块是ol.interaction.Draw。
庆祝亚运会·2020-08-15 19:04

OpenLayers 3 之 切换图层控件

在openlayers2中，是默认有切换图层控件的，但是由于某种原因，openlayers3中并没有默认实现，但却给我们很容易扩展的基类（ol.control.Control），我们可以自定义实现，并不是很难
庆祝亚运会·2020-08-15 19:04

openlayers3 自定义打包

1.简介首先放一个启发我的文章：http://www.jianshu.com/p/d06d58804414ol有很多库，有时候我们只需要部分，比如map,view.layer等。如果把整个文件都引入项目，有些浪费资源且文件过大，与最小化的思路相违。这时候就需要单独打包这些内容，这也是这边记录的主要内容，如何自定义打包我们需要的库？2.创建配置文件1.下载openlayer:npmiopenlaye
ChengYz_·2020-08-15 19:33

OpenLayers 3 简介

摘要主要聊聊OpenLayers是什么，怎么用，以及OpenLayers3相对于以前的版本有什么改进和不同。OpenLayers是干什么的？
庆祝亚运会·2020-08-15 19:56

openlayers3加图标定位

openlayers，因为公司的需求所以开始学习openlayers，刚开始想学openlayers2，但是试过几次发现openlayers2的浏览效果不好，还存在一些浏览卡顿不流畅等问题，于是我转向openlayers3
mashang666·2020-08-15 19:13

openlayers3入门——类、方法、属性详解2

//【*】地图瓦片文件目录地址ps：这个一定要设置正确的瓦片文件的位置，不然显示不出来//varurl='../img/{z}/{y}/{x}.png';//{z}{x}{y}是占位符，ol会识别的ps:这个是我用OLOffLineMapOpenEXE工具下载的地图数据的调用格式varurl='../img/{z}/{z}_{y}_{x}.jpg';//{z}{x}{y}是占位符，ol会识别的//
msnaruto·2020-08-15 18:48

openlayers3入门——类、方法、属性详解1

//创建地图newol.Map({//设置地图图层layers:[//创建一个使用OpenStreetMap地图源的瓦片图层newol.layer.Tile({source:newol.source.OSM()})],//设置显示地图的视图view:newol.View({center:[0,0],//定义地图显示中心于经度0度，纬度0度处zoom:2//并且定义地图显示层级为2}),//让id为
msnaruto·2020-08-15 18:48

使用OpenLayers3创建地图后获取地图的地理坐标coordinate

1.引用ol库引用ol样式库***引用上面两个库，href属性根据具体两个库文件位置进行设置2.使用HTML标签，创建容器(地图容器）(地图坐标容器)3.使用标签，写js脚本加载地图：//创建地图newol.Map({//设置地图图层layers:[//创建一个使用OpenStreetMap地图源的瓦片图层newol.layer.Tile({source:newol.source.OSM()})]
LEETOON·2020-08-15 18:38

openlayers3 鼠标单击事件，图片随鼠标滚动缩放事件

鼠标单击事件map.on('singleclick',mapClick);functionmapClick(e){varpixel=map.getEventPixel(e.originalEvent);featureInfo=map.forEachFeatureAtPixel(e.pixel,function(feature){returnfeature;});if(featureInfo){//
leobbis·2020-08-15 18:57

openlayers3 + canvas 通过粒子动画展示风场

openlayers3+canvas展示风场原理：将屏幕坐标转换为经纬度，再通过经纬度获取风速风向，再通过canvas绘制效果：步骤：1、随机新建粒子（显示得风得数量，确定生命周期、位置等信息），获取该粒子得风速风向
Lazy man·2020-08-15 18:24

基于Openlayers3的地图轨迹及其优化

一、背景项目线上系统经常出现一个问题，当地图轨迹点较多后者出现跨度较大的跳跃点时，地图缩放轨迹计算会导致浏览器比较卡，非常影响用户体验，根本原因是因为地图轨迹在进行缩放时，会在前端重新计算轨迹箭头图层的位置信息，当看到计算入口代码时，发现计算比较暴力，计算时间复杂度太高，需要进行优化，通过网上查询，发现一个博主的做法能有效降低计算的时间复杂度（https://blog.csdn.net/freel
最爱夜明珠·2020-08-15 18:49

openlayers3（五）根据坐标点画圆、线、多边形

所以我写的也算是基于上一篇：openLayers3（四）电子围栏—使用画图工具绘图话不多说，代码附上代码classdrawFence{//转换坐标点（多）transPoints(points){letarr
天空影·2020-08-15 18:45

openlayers3应用（一）：调用百度在线地图

本文讲述在openlayers3中使用百度地图的方法。调用百度地图，也是经过了几番周折贴上显示代码，以免其他人调用百度地图走弯路。
iteye_11787·2020-08-15 18:56

OpenLayers3-8-Custom Tooltips

原文地址：http://openlayers.org/en/v3.13.0/examples/button-title.html这个例子展示了如何使用Bootstrap来定制化你自己的按钮相关的api文档包括：ol.Map,ol.View,ol.layer.Tile,ol.source.OSMCustomTooltips.tooltip-inner{white-space:nowrap;}varm
isowang·2020-08-15 18:24

Openlayers 3 绘制过程中坐标系统转换方法示例 (EPSG4326到 3857)

Openlayers3ReprojectEPSG:4326vectortoEPSG:3857关键点:dataProject源的投影坐标系,featureProjection目的投影坐标系示例中待绘制数据的投影坐标系为
山___·2020-08-15 18:47

矢量切片(Vector tile)

矢量切片(Vectortile)说明：本月的主要工作都是围绕制作矢量切片这一个核心问题进行的，所以2月的主题就以这个问题为主，目前分支出来的一些内容主要包括了TMS(Tilemapservice)，OpenLayers3
豆破苍琼·2020-08-15 18:26

OpenLayers 3实践与原理探究4.4-ol3源码分析-render

网上有人(OpenLayers3源码那些事)总结一张图的不错，这里拿来用一下0.从map.
TechFE·2020-08-15 18:53

OpenLayers 3实践与原理探究4.1-ol3源码分析-底层基础

因为下面的内容会分模块介绍源码，所以这里为了方便，首先介绍源码的目录结构在OpenLayers3官网的下载页面下载我们在开发工程中需要的文件(如：v3.17.1.zip)，注意如果需要编译源代码，需要下载包含编译功能的文件包
TechFE·2020-08-15 18:21

openlayers3带箭头的线

line-arrows.html--官网的例子https://stackoverflow.com/questions/41606206/draw-arrow-without-using-any-image-in-openlayers3https
dreamgis·2020-08-15 18:39

openlayers学习笔记（十三）— 异步调用JSON数据画点、文字标注与连线

使用Openlayers3实现调用本地json数据在地图上添加点、文字标注以及连线。
diaoyanbian8143·2020-08-15 18:04

OpenLayers学习笔记（九）— 限制地图显示范围

openlayers3地图上限制地图显示及拖动范围，坐标系是4326转3857，中心经纬度精确到小数点后六位，减少误差GitHub:八至作者：狐狸家的鱼本文链接：ol3-限制地图显示及拖动范围查看extent
diaoyanbian8143·2020-08-15 18:33

OpenLayers学习笔记（十）— 动态加载JSON数据模拟航迹线

在openlayers3上，加载本地json数据，动态绘制航迹线，以飞机当前位置为地图中心，此例子是模拟DEMO本文链接：动态加载JSON数据模拟航迹线作者：狐狸家的鱼GitHub：八至前提需求需要以JSON
diaoyanbian8143·2020-08-15 18:33

标绘ol3版开源啦

地址:git.oschina.net/ilocation/plotBy平凡的世界plot4ol3说明基于OpenLayers3实现动态标绘API。
dhptkq9465·2020-08-15 18:01

OpenLayers3基础教程之实现地图显示功能

1.配置开发环境使用OpenLayers3开发WebGIS应用，我们首先需要配置开发环境，首先我们需要在openlayers官网获取OpenLayers3的开发库。下载链接：官网。
jiegsier·2020-08-15 18:19

使用openlayers 3 在线加载天地图及GeoServer发布的地图

之前试了openlayers2加载天地图，不过公司已经弃用2，所以使用openlayers3来加载天地图卫星图和标注图层，今天又学习了GeoServer发布地图，一并用openlayers测试加载出来，
GISER_A·2020-08-15 18:12

OpenLayers 3.x Cookbook 教程 | 中文版 | 在线文档 | 源码

OpenLayers-3.x-Cookbook-Doc书本源码：https://github.com/CHENJIAMIAN/OpenLayers-3.x-Cookbook-Doc/tree/masterOpenLayers3
CHENJIAMIAN PRO·2020-08-15 18:03

Openlayers-设置地图缩放级别

对于openlayers3来说，直接通过view的属性进行控制即可。openlayers中需要注册缩放事件来解决，在该事件中监听缩放后地图的级别，当地图级别小于
a18826265589·2020-08-15 18:30

OpenLayers学习笔记高级篇（二、地图控件）

在OpenLayers3中，地图控件指的是下图标注的这些，包括缩放按钮，标尺，版权说明，指北针等等。他们不会随着地图的移动而移动，一直处于一个固定的位置。
MagicMHD·2020-08-15 18:32

OpenLayers学习笔记初级篇（一、地图加载）

1、OpenLayers3简介OpenLayers3简称ol3，它是一个开源的WebGIS引擎，使用了Ja
MagicMHD·2020-08-15 18:31

openlayers3中的overlay图标入门

学习overlayvarmap=newol.Map({layers:[newol.layer.Tile({source:newol.source.OSM()})],view:newol.View({center:ol.proj.fromLonLat([103,30]),zoom:8,}),target:'map'})//下边创建一个overlayvarmapElement=document.get
bigFace2019·2020-08-15 18:20

openlayers3笔记：使用overlay

学习overlayVectorLabelsOverlayLabels标注点body,html,div,ul,li,iframe,p,img{border:none;padding:0;margin:0;}#map{width:100%;height:570px;}#menu{width:100%;height:20px;padding:5px10px;left:10px;font-size:14p
bigFace2019·2020-08-15 18:20

OpenLayers3加载百度地图

BaiduMapSource.js/***加载百度地图*@returns{ol.layer.Tile}*/functionloadBaiduMap(){//数据源信息varattribution=newol.Attribution({html:'Copyright:©2015Baidu,i-cubed,GeoEye'});//地图范围varextent=[-20037508.34,-20
Gary_Leong·2020-08-15 18:17

动态标绘演示系统1.0(for OpenLayers3)

实现OpenLayers3（http://openlayers.org）版本的动态标绘API。目前1.0版本，仅支持简单符号绘制。
gispace·2020-08-15 18:46

Openlayers3中SVG图加载

概述：鉴于SVG的优势，在图层展示的时候，会想到SVG的方式，但是OL3里面只支持ImageStatic的方式加载，也就是只能加载栅格图片，为此，本文实现Openlayer3中SVG图层的展示。效果：SVG图片缩放后代码：functionaddSvgLayer(){var_min=[12836027.844390793,4745190.4650304755],_max=[13098185.2452
LZU-GIS·2020-08-15 18:45

Openlayers3中实现地图的切割

概述：本文讲述如何在Openlayers3中结合canvas实现对地图的切割。
LZU-GIS·2020-08-15 18:45

Openlayers3 实现点击不同的图标弹出不同的popup信息

1、我们老师的书籍《WebGIS之Openlayers全面解析》上面有关于popup的例子，作为例子，肯定是写死的，没有查询数据库，也就是只有一个地理位置。（先不要管为什么看不到地图）如下图：2、我想要的效果就是，查询数据库，找出所有的监测站点，并把这些站点显示在地图上，点击不同的站点能弹出不同的信息。如下图，是我想要的效果：3、先给出书本上参考例子的代码，接下来对例子的代码进行修改，达到我想要的
YSoup·2020-08-15 18:40

JavaScript、jquery方法累计

JavaScript、jquery方法累计四、openlayers3制图iP.init=function(PlanAirLine,RealAirLine,arrx,arry){varPlanAirPoint
BoBoLUI·2020-08-15 18:36

OpenLayers3入门篇-点的扩散效果

点的扩散效果原理与点在线上的运动类似，先根据传入的坐标先创建一个layer,然后绑定一个addfeature的事件（flush函数），在这个事件里面随着时间的推移不断的对这个layer的style进行设置从而动态的做出扩散的效果出来functionpointLight(pointC){map.removeLayer(vector2);pointCoord=pointC;varsource=newo
adventure_xph·2020-08-15 18:03
上一页 1 2 3 4 5 6 7 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他