/**
* 获取地图上的图层对象
* @param map 地图对象
* @param layerName 实例化图层时的name
* @return {null}
*/
getLayerByLayerName: (map, layerName) => {
  if (!map) {
    throw new Error('未传入地图对象')
  }
  let targetLayer = null
  const layers = map.getLayers().getArray()
  Object.keys(layers).forEach(function (key) {
    const _layerName = layers[key].values_.layerName
    if (_layerName === layerName) {
      targetLayer = layers[key]
    }
  })
  return targetLayer
}
 
import Overlay from 'ol/Overlay'
import $ from 'jquery' const openLayerAction = {
/**
* 添加闪烁数据的方法
* @param {Array} twinkleList 需要添加css样式的点位数组
* @param {String} LGTDName 经度在数组中对应的名称
* @param {String} LTTDName 纬度度在数组中对应的名称
* @param {String} className 需要添加的css样式名称
* @param {String} index 数组中唯一索引的键名
*/
setTwinkleLayer(id, globalMap, twinkleList, className, index = 'id') {
for (let i = 0; i < twinkleList.length; i++) {
$('#' + id).after(
"<div id = '" + id +
twinkleList[i][index] +
"' class = '" +
className +
"' onclick='console.log(" +
twinkleList[i][index] +
")'>" + '</div>'
) const anchor = new Overlay({
element: document.getElementById(id + twinkleList[i][index]),
positioning: 'center-center'
})
// 关键的一点,需要设置附加到地图上的位置
anchor.setPosition([twinkleList[i].lgtd, twinkleList[i].lttd])
// 然后添加到map上
globalMap.addOverlay(anchor)
}
}, /**
* 删除闪烁数据的方法
* @param {String} className 需要删除的css样式名称
*/
removeTwinkleLayer(globalMap) {
globalMap.getOverlays().clear()
}
}
export default openLayerAction

前端工作中用到的openlayers相关的公共方法的更多相关文章

  1. 前端工作面试HTML相关问题

    前端工作面试HTML相关问题 Q: doctype(文档类型)的作用是什么? A: 在HTML中 doctype 有两个主要目的. 对文档进行有效性验证: 它告诉用户代理和校验器这个文档是按照什么DT ...

  2. 打造高效前端工作环境 - tmux

    打造高效前端工作环境 - tmux 前言  现在前端开发可不容易啊,先打开个VIM,然后再打开个lite-server,一不小心写个ES2015还要打开个gulp来做预编译,如果能把这么多个窗口放在一 ...

  3. 前端工作面试问题--摘取自github

    前端工作面试问题 本文包含了一些用于考查候选者的前端面试问题.不建议对单个候选者问及每个问题 (那需要好几个小时).只要从列表里挑选一些,就能帮助你考查候选者是否具备所需要的技能. 备注: 这些问题中 ...

  4. web前端—工作周报

    2016.07.25-2016.07.29周报: 1.本周工作主要内容: A:完成了宏视云h5播放器升级及大数据上报: B:修复xk-h5播放器bug:在三星手机自带浏览器无法进行滑动seek;  C ...

  5. 前端发展态势 && 前端工作流程个人浅析

    于在未开启cleartype的情况下,一些中文字体在非偶数字号下的显示效果欠佳,所以一般建议使用12.14.16.18.22px等偶数字号.也就 是对某个分辨率选择离它最近的偶数字号.例如:屏幕横向分 ...

  6. 前端工作流程自动化——Grunt/Gulp 自动化

    什么是自动化 先来说说为什么要自动化.凡是要考虑到自动化时,你所做的工作必然是存在很多重复乏味的劳作,很有必要通过程序来完成这些任务.这样一来就可以解放生产力,将更多的精力和时间投入到更多有意义的事情 ...

  7. 工作中用到的linux命令

    都是工作中用到的,解决问题至上,不求甚解,怕再忘了,所以记录一下,勿喷. .log |,,,,|,| 先说一下这条命令: cat:打印文件内容 grep:查找,用到的有\s匹配空白字符 sed:刚用到 ...

  8. 我在一个前端项目中用js整理的一些通用方法,其中使用到的思想,主要就是约定了。

    把名称和后台来的json数据约定起来,可以达到的效果就是可以将东西统一化,减少差异,提升模块等的通用性,此后就可以实现具体不同模块内容可以自动或拷贝赋值的方式 2016.7.18 refactor s ...

  9. Liu Junqiao:工作中用到的命令以及问题汇总

    工作中用到的命令以及问题汇总 2019-11-29 查看系统运行时间,这个问题是因为我们在阿里云上有个机器,在某一天发现这台机器上有的服务莫名奇妙的停了,然后排查时怀疑机器被重启过用如下如下命令查看了 ...

随机推荐

  1. victoriaMetrics库之布隆过滤器

    victoriaMetrics库之布隆过滤器 代码路径:/lib/bloomfilter 概述 victoriaMetrics的vmstorage组件会接收上游传递过来的指标,在现实场景中,指标或瞬时 ...

  2. Blazor Bootstrap 组件库语音组件介绍

    Speech 语音识别与合成 通过麦克风语音采集转换为文字(STT),或者通过文字通过语音朗读出来(TTS) 本组件依赖于 BootstrapBlazor.AzureSpeech,使用本组件时需要引用 ...

  3. 基于知名微服务框架go-micro开发gRPC应用程序

    go-micro是golang的一个微服务框架. go-micro各个版本之间的兼容性问题一直被诟病,前几年go-micro更是分化出了两个分支: 一个延续了go-micro,只不过转到了其公司CEO ...

  4. Java并发编程之Lock(同步锁、死锁)

    这篇文章是接着我上一篇文章来的. 上一篇文章 同步锁 为什么需要同步锁? 首先,我们来看看这张图. 这是一个程序,多个对象进行抢票. package MovieDemo; public class T ...

  5. properties、yml配置文件映射对象

    1.properties文件内容映射到类对象(属性),如Resource目录下的1.properties文件已配置前缀为com.imooc.people相关的信息,然后: pom添加依赖:spring ...

  6. myeclipse10的问题

    1.导入项目后java文件头部出现The type java.lang.CharSequence cannot be resolved. It is indirectly referenced fro ...

  7. HTML5 Canvas 超逼真烟花绽放动画

    各位前端朋友们,大家好!五一假期即将结束,在开启加班模式之前,我要给大家分享一个超酷超逼真的HTML5 Canvas烟花模拟动画.这次升级版的烟花动画有以下几个特点: 烟花绽放时,将展现不同的色彩,不 ...

  8. 一篇文章教你搞懂日志采集利器 Filebeat

    关注「开源Linux」,选择"设为星标" 回复「学习」,有我为您特别筛选的学习资料~ 本文使用的Filebeat是7.7.0的版本,文章将从如下几个方面说明: Filebeat是什 ...

  9. MyCat 使用中问题记录

    MyCat问题记录: Unknown charsetIndex:255 异常消息: jvm 1 | 2022-04-27 14:09:13,337 [WARN ][$_NIOREACTOR-13-RW ...

  10. Ubuntu中安装redis

    第一种方式在线安装首要前提安装c语言编译环境,命令如下:$sudo apt-get install gcc 安装完成后可以输入$gcc --version查看版本 1.获取源码:$wget https ...