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中使用百度地图的方法.调用百度地图,也是经过了几番周 ...
随机推荐
- HTML中      等6种空白空格
- [51nod1236] 序列求和 V3(斐波那契数列)
题面 传送门 题解 把求和的柿子用斐波那契数列的通项公式展开 \[ \begin{aligned} Ans &=\sum\limits_{i = 1}^{n} \left(\frac{(\fr ...
- centos6 x64安装elasticsearch5.5.2启动报错
ERROR: [3] bootstrap checks failed[1]: max file descriptors [4096] for elasticsearch process is too ...
- The server of Nginx(一)——Nginx基础及静态网站的构建
一.Nginx介绍 火了半边天的Nginx和Apache一样也是Web服务器,专为性能优化而开发,也可以像Squid一样做反向代理,或者邮件代理等许多用途,并有windows的移植版,其最知名的优点是 ...
- python基础之条件判断
一.简单的if语句 举例 if money > 10000: print '我们去旅游吧' #左侧一定要有缩进,一般4个空格 print '请输入学生的考试成绩' score = print ( ...
- C# 精准计时之 QueryPerformanceCounter QueryPerformanceFrequency用法
C# 用法: public static class QueryPerformanceMethd { [DllImport("kernel32.dll")] public exte ...
- 关于VisualStudio性能分析数据中的独占样本数和非独占样本数的意义
VisualStudio中自带有Profile工具进行性能性能分析,其中用得比较多的数据是函数调用时间,它主要有独占样本数和非独占样本数两个指标,关于这两个指标代表的意义,MSDN的解释比较文艺: 非 ...
- [NOI2010]能量采集 BZOJ2005 数学(反演)&&欧拉函数,分块除法
题目描述 栋栋有一块长方形的地,他在地上种了一种能量植物,这种植物可以采集太阳光的能量.在这些植物采集能量后,栋栋再使用一个能量汇集机器把这些植物采集到的能量汇集到一起. 栋栋的植物种得非常整齐,一共 ...
- Apache htaccess 设置....
NC: no case,就是说不区分大小写R:redirect,重定向F:forbidden,禁止访问L:last,表示已经是最后一条规则,.htaccess文件解析即将退出 比如原地址为 /beau ...
- 109th LeetCode Weekly Contest Number of Recent Calls
Write a class RecentCounter to count recent requests. It has only one method: ping(int t), where t r ...