openLayers3 中实现多个Overlay
此篇的目的是为了记录下用Overlay的一些操作。
其实实现多个就是创建多个div,然后给每个div绑定Overlay。
//页面加载完函数 --显示个关键点的名称
window.onload = function (){
var pointfeatures = vectorLayerPoint.getSource().getFeatures();//获取点关键点图层的所有点信息
//遍历每个点
for(var i=;i<pointfeatures.length;i++){
//新增放置overly的div
$("#overly").after("<div id = 'overly"+i+"' class = 'overlay'>"+pointfeatures[i].get('pointtype')+"</div>");
//新增overly
var marker= new ol.Overlay({
//overly的位置[11,22]格式
position:pointfeatures[i].getGeometry().getCoordinates(),
//overly放置的div
element: document.getElementById('overly'+i)
});
//逐个把overly添加到地图上
map.addOverlay(marker);
} }
openLayers3 中实现多个Overlay的更多相关文章
- Openlayers3中实现地图的切割
概述: 本文讲述如何在Openlayers3中结合canvas实现对地图的切割. 效果: 全图 切割北京区域 切割河北区域 实现: <html xmlns="http://www.w3 ...
- openlayers3中应用proj4js
要在openlayers3中应用proj4js,需要在html中引用proj4js,然后在引用所需要的projection的js定义,如 http://epsg.io/21781-1753.js 然后 ...
- openlayers3中Overlay用法
Overlay 从名字看,是覆盖图.覆盖物的意思,主要的用途就是在地图之上再覆盖一层,用以显示额外的可见元素,可见元素一般是 HTML 元素,利用 overlay,可以将可见元素放置到地图的任意位置, ...
- OpenLayers3中wfs的属性查询
var vector = new ol.layer.Vector({ source: new ol.source.Vector({ format: new ol.format.GeoJSON(), u ...
- Openlayers3中实现台风风圈绘制算法
概述: 台风的风圈的NE.NW.SW.SE四个方位的影响范围是不一致,本文介绍一种简单的风圈的绘制方法,并在OL3中展示. 实现效果: 实现代码: 1.数据格式 var Configs = { CIR ...
- (转)OpenLayers3基础教程——OL3之Popup
http://blog.csdn.net/gisshixisheng/article/details/46794813 概述: 本节重点讲述OpenLayers3中Popup的调用时实现,OL3改用O ...
- OpenLayers3基础教程——OL3之Popup
概述: 本节重点讲述OpenLayers3中Popup的调用时实现,OL3改用Overlay取代OL2的Popup功能. 接口简单介绍: overlay跟ol.control.Control一样,是一 ...
- Keil C51 中的函数指针和再入函数
函数指针是C语言中几个难点之一.由于8051的C编译器的独特要求,函数指针和再入函数有更多的挑战需要克服.主要由于函数变量的传递.典型的(绝大部分8051芯片)函数变量通过堆栈的入栈和出栈命令来传递. ...
- openlayers3应用一:显示百度地图
在项目中使用百度地图,最直接的方式是使用百度api,但是使用百度api需要申请key,并且某些功能调用有次数限制. 本文讲述在openlayers3中使用百度地图的方法.调用百度地图,也是经过了几番周 ...
随机推荐
- windows10 docker 使用以及虚拟机下fastDFS 的使用教程
我们 先来了解下 什么是docker? Docker的思想来自于集装箱,集装箱解决了什么问题?在一艘大船上,可以把货物规整的摆放起来.并且各种各样的货物被集装箱标准化了,集装箱和集装箱之间不会互相 ...
- 【SSO单点系列】(5):CAS4.0 单点流程序列图
刚过元旦假期,感觉自己好久没写博客了,今天更新一篇,主要是CAS 的一个流程图. ps: 这两张图 是直接从官网上找的,都是简单的英语,我这种英语四级没过都看得懂,大家应该没有压力. 1.CAS 基本 ...
- CentOS中源码编译安装Nginx
1.从官网通过wget命令将Nginx源码包下载到Linux上 Nginx下载页面:http://nginx.org/en/download.html 2.在Linux上安装需要依赖的环境 yum ...
- centos6+如何对外开放80,3306端口号或者其他端口号
1.查看防火墙对外开放了哪些端口 [root@hadoop110 ~]# iptables -L -n Chain INPUT (policy ACCEPT) target prot opt sour ...
- C# 函数参数object sender, EventArgs e
object sender:表示触发事件的控件对象EventArgs e:表示事件数据的类的基类 Windows程序有一个事件机制.用于处理用户事件. 在WinForm中我们经常需要给控件添加事件.例 ...
- docker: Error response from daemon: Get https://registry-1.docker.io/v2/: net/http: request canceled (Client.Timeout exceeded while awaiting headers).
docker: Error response from daemon: Get https://registry-1.docker.io/v2/: net/http: request canceled ...
- 未在本地计算机上注册microsoft.jet
未在本地计算机上注册microsoft.jet http://www.microsoft.com/zh-cn/download/confirmation.aspx?id=13255
- QDU_CEF(补)
C - Arthur and Table Arthur has bought a beautiful big table into his new flat. When he came home, A ...
- 加、减、乘、除 高精度 string
#include<stdio.h> #include<string> #include<string.h> #include<iostream> usi ...
- linux 文件截取
相关函数:open, ftruncate 表头文件:#include <unistd.h> 定义函数:int truncate(const char *path, off_t length ...