openlayer

Openlayers+vue集成实现地图简单功能

废话不多说，代码端上来绘制常用区域输出Json测距测面量角全屏清除点坐标放大缩小刷新import'ol/ol.css'importMapfrom'ol/Map'importViewfrom'ol/View'importVectorSourcefrom'ol/source/Vector'importOSMfrom'ol/source/OSM'importVectorLayerfrom'ol/laye
·2022-01-20 10:48

从零打造一个Web地图引擎

说到地图，大家一定很熟悉，平时应该都使用过百度地图、高德地图、腾讯地图等，如果涉及到地图相关的开发需求，也有很多选择，比如前面的几个地图都会提供一套jsAPI，此外也有一些开源地图框架可以使用，比如OpenLayers
·2022-01-18 22:12

openlayers二次简单封装 线性、点

从自己的角度,简单的二次封装了一下openlayer,在这里提供一下我的思路!
ifyang小白·2022-01-11 17:51

解析OpenLayers 3加载矢量地图源的问题

一、矢量地图矢量图使用直线和曲线来描述图形，这些图形的元素是一些点、线、矩形、多边形、圆和弧线等等，它们都是通过数学公式计算获得的。由于矢量图形可通过公式计算获得，所以矢量图形文件体积一般较小。矢量图形最大的优点是无论放大、缩小或旋转等不会失真。在地图中存在着大量的应用，是地图数据中非常重要的组成部分。为了便于存储，传递，使用，矢量地图会按照一定的格式来表达，比如常见的GeoJSON，TopoJS
·2021-12-22 19:08

「笔记」Openlayers鹰眼空白+本地图源

import*aslayerfrom'ol/layer';importTilefrom'ol/layer/Tile';import*asolControlfrom'ol/control';//图源怎么引的本篇不讲//要注意overviewLayerGroup和mapLayerGroup图层要相同，相同不是指完全相等//不然地图和鹰眼会抢canvas。this.mapLayerGroup=newla
花森文宝·2021-12-10 11:54

Vue+Openlayer实现图形的拖动和旋转变形效果

目录前言相关资料实现效果实现步骤前言openlayer是有他自己的扩展插件ol-ext，我们这里用他来实现图形的操作：拖拽、旋转、缩放、拉伸、移动等等功能，以及他的监听事件，毕竟我们作图以后是需要保存数据给后端
·2021-11-26 18:04

vue利用openlayers加载天地图和高德地图

目录一、天地图部分1、在vue中安装openlayers二、高德地图部分一、天地图部分1、在vue中安装openlayersnpmi--saveol这里说的vue是基于脚手架构建的。
·2021-11-24 15:49

vue+openlayer实现：拖拽、旋转、缩放、拉伸、移动等功能以及对应的监听事件

前言：openlayer是有他自己的扩展插件ol-ext，我们这里用他来实现图形的操作：拖拽、旋转、缩放、拉伸、移动等等功能，以及他的监听事件，毕竟我们作图以后是需要保存数据给后端，存到数据库的。
浩星·2021-11-24 14:17

vue+openlayer5获取当前鼠标滑过的坐标实现方法

前言：在vue项目中怎么获取当前鼠标划过的坐标呢，这里来分享下方法。实现效果：实现步骤：1、引入相关文件importMousePositionfrom'ol/control/MousePosition';import{createStringXY}from'ol/coordinate';2、生成地图varlayers=[//深蓝色背景newTileLayer({source:newXYZ({url
·2021-11-16 11:59

vue3+vite2+element-plus+ts搭建一个项目

花了几天用vue3+vite2+element-plus+ts搭了个极简版骨架型数据管理系统，使用静态数据模拟动态路由，路由拦截，登录页面鉴权等，使用了iconify字体图标，整合了cesium,openlayers
奔跑的痕迹·2021-10-24 09:24

vue3+vite2+element-plus+ts搭建一个项目

花了几天用vue3+vite2+element-plus+ts搭了个极简版骨架型数据管理系统，使用静态数据模拟动态路由，路由拦截，登录页面鉴权等，使用了iconify字体图标，整合了cesium,openlayers
奔跑的痕迹·2021-10-24 09:33

基于vue+openlayer实现地图聚合和撒点效果

目录前言：实现效果：1、聚合效果：2、撒点效果：具体实现步骤：1、项目中引入openlayer2、配置(按需引入)3、实现地图展示4、撒点功能5、聚合效果前言：openlayer是目前我们gis常用的一款开源的
·2021-09-15 14:13

openlayers6之地图覆盖物overlay详解

1.overlay简述overlay是覆盖物的意思，顾名思义就是在地图上以另外一种形式浮现在地图上，这里很多同学会跟图层layers搞混淆，主要是放置一些和地图位置相关的元素，常见的地图覆盖物为这三种类型，如：popup弹窗、label标注信息、text文本信息等，而这些覆盖物都是和html中的element等价的，通过overlay的属性element和html元素绑定同时设定坐标参数——达到将
·2021-09-15 14:10

openlayers6之地图覆盖物overlay三种常用用法(popup弹窗marker标注text文本)

目录1.写在前面2.overlay实现popup弹窗2.1vue页面addPopup()方法详解2.2autoPan属性为false效果3.overlay实现label标注信息4overlay实现text文本信息5.附上完整代码1.写在前面常见的地图覆盖物为这三种类型，如：popup弹窗、label标注信息、text文本信息等。上篇讲了overlay的一些属性方法事件等，这篇主要讲overlay三
·2021-09-15 14:10

Vue + OpenLayers 快速入门学习教程

Openlayers是一个模块化、高性能并且功能丰富的WebGIS客户端的JavaScript包，用于显示地图及空间数据，并与之进行交互，具有灵活的扩展机制。
·2021-09-15 12:31

GIS常用算法

作为一个GISer，在日常WebGIS开发中，会常用到的turf.js，这是一个地理空间分析的JavaScript库，经常搭配各种GISJSAPI使用，如leaflet、mapboxgl、openlayers
·2021-09-10 11:43

Vue+Openlayer使用modify修改要素的完整代码

Vue+Openlayer使用modify修改要素，具体内容如下所示：import{Modify}from"ol/interaction";可自动捕捉可修改点、线、面。
·2021-09-08 11:05

Vue+Openlayer批量设置闪烁点的实现代码(基于postrender机制)

效果图：实现代码：import"ol/ol.css";importTileLayerfrom"ol/layer/Tile";importVectorLayerfrom"ol/layer/Vector";importVectorSourcefrom"ol/source/Vector";importXYZfrom"ol/source/XYZ";import{Map,View,Feature}from"
·2021-09-01 17:04

VUE + OPENLAYERS实现实时定位功能

前端展示，使用Vue+OpenLayers，负责定时向后端服务请求GeoJSON数据，并在以标签的形式展现定位数据。实现的效果：一、定义标签样式varimage=n
·2021-09-01 17:04

基于Vue+Openlayer实现动态加载geojson的方法

加载1个或多个要素import"ol/ol.css";importTileLayerfrom"ol/layer/Tile";importVectorLayerfrom"ol/layer/Vector";importVectorSourcefrom"ol/source/Vector";importXYZfrom"ol/source/XYZ";import{Map,View,Feature,ol}fr
·2021-09-01 17:33

Vue中使用Openlayer实现加载动画效果

注意：实现动画时不能有scoped！！！！通过gifimport"ol/ol.css";import{Map,View,Overlay}from"ol";importTileLayerfrom"ol/layer/Tile";importOSMfrom"ol/source/OSM";exportdefault{name:"gif",data(){return{map:{},overlay:{},ma
·2021-08-31 17:57

vue+openlayers绘制省市边界线

本文实例为大家分享了vue+openlayers绘制省市边界线的具体代码，供大家参考，具体内容如下1、创建项目vueinitwebpackol_vue2、安装ol依赖包npminstallol3、引入axiosnpminstallaxios
·2021-08-26 19:20

vue项目中openlayers绘制行政区划

vue项目中openlayers画行政区划（区域范围），供大家参考，具体内容如下原理在地图上画需要的范围，实际上就是在地图上打上一圈点，然后依次将这些点用线连接，就形成了范围引用相应的ol模块importVectorLayerfrom'ol
·2021-08-26 19:19

Vue+Openlayer中使用select选择要素的实现代码

效果图：实现代码：import"ol/ol.css";import{Map,View}from"ol";import{OSM,VectorasVectorSource}from"ol/source";import{VectorasVectorLayer,TileasTileLayer}from"ol/layer";importGeoJSONfrom"ol/format/GeoJSON";impor
·2021-08-26 19:16

OpenLayers入门（二）

前言好久不见，距离OpenLayers入门第一篇已经过了很久，为什么迟迟没有后续呢，主要有两个原因，一是因为近期项目里使用地图的部分比较少，二是因为很多时候即使功能做出来了，但是还是不能完全理解，不是很明白的东西除了贴代码之外也写不了啥
·2021-08-03 00:09

OpenLayers入门（一）

OpenLayers简介OpenLayers（https://openlayers.org/）是一个用来帮助开发Web地图应用的高性能的、功能丰富的JavaScript类库，可以满足几乎所有的地图开发需求
·2021-08-03 00:08

Cesium轨迹回放

在使用openlayers做二维地图的时候也开发过轨迹回话，其基本思路就是使用一个定时器，实时更新车辆的位置的方向，让车辆在轨迹上跑，做法也比较简单，在Cesium中，使用CZML实现起来更容易。
写前端的大叔·2021-07-20 14:08

SuperMap二维iClient客户端如何添加自定义请求头(一）

在项目实际应用中，有时候需要在发送请求中添加一些自定义的请求头，那现在来看看SuperMap二维iClient客户端中是如何是使用的捏1.版本支持情况二维iClientforLeaflet/Openlayers
ayiyayiyo·2021-06-26 05:44

openlayers3中Geojson加载要素互相遮盖妙解

openlayers3中记载geojson文件，其实没有那么难，官网有例子，网上有demo，是呀，加载个图形，线段或者点的很容易，但是哥这次加载的是一幅json格式的室内地图（高逼格），各种图形错综复杂
FunGIS·2021-06-23 20:49

openlayers4 入门开发系列之地图空间查询篇（附源码下载）

前言openlayers4官网的api文档介绍地址openlayers4api，里面详细的介绍openlayers4各个类的介绍，还有就是在线例子：openlayers4官网在线例子，这个也是学习openlayers4
gis之家·2021-06-13 10:30

leaflet做导航

概述Leaflet是一个开源的Javascript地图库，与OpenLayers比起来就是对移动端稍微友好一点。不过说到底还是个JS库，主要用在网页上的，在网页上做导航这个设定就有点蛋疼。
左牵狗·2021-06-09 11:22

openlayers

map={layer:{source:{feature:[],addFeature(){}}}}image.png
丶End·2021-06-06 12:45

Vue、OpenLayers结合天地图实现Gis

地图(卫星)-->-->-->-->-->-->-->-->-->事件类型import*asGisfrom'@/api/modules/gis/gis'//接口import$from'jquery'//openLayerimport
蜗牛与藤曼·2021-05-27 16:32

openlayers3的源码结构

由于在工作中经常使用openlayers，作为GIS前端框架之一，有必要对openlayers在源码上有一定认识，因此整理了v3.17.1版本的源码结构图，如图：
dawn_P·2021-05-21 05:19

shape文件上传与展示

上传展示流程图实现效果面线点使用技术jquery插件uploadify和ServletFileUpload实现shp文件的上传；ZipFile实现zip文件的解压；Geotools实现shp文件转换为geojson；openlayers4
lzugis·2021-05-20 21:51

vue+openlayers学习

vue-cli3.0.1:https://cli.vuejs.org/guide/installation.htmlcnpminstall-g@vue/clivue-V查看版本2、新建项目vuecreatevue-openlayers
漫漫江雪·2021-05-18 05:01

用openlayers实现矢量地图数据的展示

如果我们有一些矢量数据，如何利用OPENLAYERS将这些数据在网络上进行发布呢？
d大道至简d·2021-05-15 17:43

QGIS Add Custom Basemap

adding-additional-stamen-map-tiles-to-qgis-2-4-tutorial/I、InstallQGISvisitOfficialSitedownloadII、InstallOpenlayersPluginunderPluginsmenu
竹林品雨·2021-05-12 06:12

2017.9.29 OpenLayers和各地中秋习俗

分享人：黄华英OpenLayersimage.png为了调用map，需要做3件事情：调用OpenLayersmap容器JavaScript新建map1.调用2.用于包含地图3.JS创建mapvarv1=
胡諾·2021-05-10 02:22

WebGIS 2-2-2交互式绘制(规则)多边形

规则)绘制多边形1.步骤1)全局变量varmap,layer;vardrawControl;//笔varvecLayer;//纸2)加载地图functioninit(){//创建地图容器map=newOpenLayers.Map
故因·2021-05-09 04:53

openlayers5-距离测量和面积量测

升级到最新版openlayers5.2,重新写量测方法，官网examples里面有实现好的代码，但是项目是基于vue的模块化开发，官网的例子直接引入不是很合适，并且官网的例子是可以一直连续的测量，而项目中需要测量一次的方法
知足常乐晨·2021-05-02 13:19

用OpenLayers 3加载Bing在线中文版地图

OpenLayers3中提供了加载Bing地图的sourceol.source.BingMaps，但是并不支持中文，构造函数的参数culture设置为中国是不行的，应该是Bing地图目前并没有提供中国区域的瓦片在线服务
猿基地·2021-04-29 13:30

uniapp 实现聚合点，点闪烁，动态展示选择的行政区域点，wms图层展示

最开始想着用openlayers来写，但是后面展示出来的效果不好，反应慢，且地图模糊，直接pas
Luo`my·2021-04-25 16:44

【GIS】QGIS中2.5D渲染和导出三维场景

qgis2threejs可能也有新版了……1.数据准备准备一份带高程的面状要素数据集，可以手动添加高度字段2.配置2.5D样式先选择2.5D样式，设置高度字段和倾斜角度等再设置其他配色样式，如渐变色等3.安装插件openlayersplugin
PancakeCard·2021-04-25 02:48

openlayers地图框架使用介绍

因为项目使用openlayers地图框架，所以就研究了一下，配置了一些可以复制粘贴修改的代码！，基础配置怎么让地图出来、属性等我不详细说了，API看看复制都行！只讲解一下怎么绘制各种图层！
虚幻的锈色·2021-04-22 20:27

基于openlayers实现角度测量功能

基于openlayers的测量功能，官网提供了长度测量和角度测量，但是没有角度测量，在此写一下基于openlayers的角度测量功能，主要方法如下：varformatAngle=function(line
·2021-04-21 13:09

OpenLayers/leaflet/Mapbox/AGS等GIS前端总结概述

leaflet/openlayers轻量级，那么轻在哪里（相比ArcGISjs，甚至Openlayers）？
ziling123·2021-04-19 07:23

开源库

js库turfjs(空间分析）leafletcesiumopenlayersarcgisapiforjavascriptthree.jswebgl
1e6c2b3901b0·2021-04-17 17:10

WebGIS引擎现状与未来

一引言作为十年GIS老兵，常常遇到同行或领导的灵魂拷问，“为什么我们不用google地图啊，我看它的3D很好啊”，“OpenLayers6支持3D吗？”
遥想公瑾当年·2021-04-12 19:09

openlayers的基本使用

1、环境构建yarnaddol2、引入文件(按需引入)import"ol/ol.css";import{Map,View}from"ol";import*asolProjfrom"ol/proj";import{VectorasVectorLayer,Tile}from"ol/layer";importFeaturefrom"ol/Feature";import{Point}from"ol/geo
·2021-04-07 10:25
上一页 9 10 11 12 13 14 15 16 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他