前端工作中用到的openlayers相关的公共方法
/**
* 获取地图上的图层对象
* @param map 地图对象
* @param layerName 实例化图层时的name
* @return {null}
*/
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相关的公共方法的更多相关文章
- 前端工作面试HTML相关问题
前端工作面试HTML相关问题 Q: doctype(文档类型)的作用是什么? A: 在HTML中 doctype 有两个主要目的. 对文档进行有效性验证: 它告诉用户代理和校验器这个文档是按照什么DT ...
- 打造高效前端工作环境 - tmux
打造高效前端工作环境 - tmux 前言 现在前端开发可不容易啊,先打开个VIM,然后再打开个lite-server,一不小心写个ES2015还要打开个gulp来做预编译,如果能把这么多个窗口放在一 ...
- 前端工作面试问题--摘取自github
前端工作面试问题 本文包含了一些用于考查候选者的前端面试问题.不建议对单个候选者问及每个问题 (那需要好几个小时).只要从列表里挑选一些,就能帮助你考查候选者是否具备所需要的技能. 备注: 这些问题中 ...
- web前端—工作周报
2016.07.25-2016.07.29周报: 1.本周工作主要内容: A:完成了宏视云h5播放器升级及大数据上报: B:修复xk-h5播放器bug:在三星手机自带浏览器无法进行滑动seek; C ...
- 前端发展态势 && 前端工作流程个人浅析
于在未开启cleartype的情况下,一些中文字体在非偶数字号下的显示效果欠佳,所以一般建议使用12.14.16.18.22px等偶数字号.也就 是对某个分辨率选择离它最近的偶数字号.例如:屏幕横向分 ...
- 前端工作流程自动化——Grunt/Gulp 自动化
什么是自动化 先来说说为什么要自动化.凡是要考虑到自动化时,你所做的工作必然是存在很多重复乏味的劳作,很有必要通过程序来完成这些任务.这样一来就可以解放生产力,将更多的精力和时间投入到更多有意义的事情 ...
- 工作中用到的linux命令
都是工作中用到的,解决问题至上,不求甚解,怕再忘了,所以记录一下,勿喷. .log |,,,,|,| 先说一下这条命令: cat:打印文件内容 grep:查找,用到的有\s匹配空白字符 sed:刚用到 ...
- 我在一个前端项目中用js整理的一些通用方法,其中使用到的思想,主要就是约定了。
把名称和后台来的json数据约定起来,可以达到的效果就是可以将东西统一化,减少差异,提升模块等的通用性,此后就可以实现具体不同模块内容可以自动或拷贝赋值的方式 2016.7.18 refactor s ...
- Liu Junqiao:工作中用到的命令以及问题汇总
工作中用到的命令以及问题汇总 2019-11-29 查看系统运行时间,这个问题是因为我们在阿里云上有个机器,在某一天发现这台机器上有的服务莫名奇妙的停了,然后排查时怀疑机器被重启过用如下如下命令查看了 ...
随机推荐
- MyBatis 及 MyBatis Plus 纯注解方式配置(Spring Boot + Postgresql)
说明 当前的版本为 MyBatis 3.5.9 MyBatis Plus 3.5.1 Spring Boot 2.6.4 Postgresql 42.3.3 与 Spring Boot 结合使用 My ...
- Vue整合axios 插件方式
1 创建一个vue的项目 使用命令 vue create axios-vue 创建,可以什么都不用勾选 2 安装axios npm install axios --save 如果安装过程很慢的话,也可 ...
- 某空间下的令牌访问产生过程--Kubernetes Dashboard(k8s-Dashboard)
在面试中发现,有些运维人员基本的令牌访问方式都不知道,下面介绍下令牌的产生过程 某个空间下的令牌访问产生过程(空间名称为cc) ###创建命名空间[root@vms61 ccadmin]# kubec ...
- java的collection类
collection来源于java.util包. Collection 接口常用的方法 size():返回集合中元素的个数 add(Object obj):向集合中添加一个元素 addAll(Coll ...
- 2021.11.05 eleveni的水省选题的记录
2021.11.05 eleveni的水省选题的记录 因为eleveni比较菜,但是eleveni不想写绿题(总不能说是被绿题虐得不想写),eleveni决定继续水noip原题. --实际上菜菜的el ...
- 你不知道的下划线属性-text-decoration
大家好,我是半夏,一个刚刚开始写文的沙雕程序员.如果喜欢我的文章,可以关注 点赞 加我微信:frontendpicker,一起学习交流前端,成为更优秀的工程师-关注公众号:搞前端的半夏,了解更多前端知 ...
- 『现学现忘』Git基础 — 10、配置Git用户签名说明
目录 1.为什么要创建用户签名 2.为什么要在Git中配置这些信息 3.创建用户签名的方式 4.总结 1.为什么要创建用户签名 作为版本控制系统的客户端,每台客户机对版本库的所有提交操作,都需要注明操 ...
- 『现学现忘』Git基础 — 12、Git用户签名(补充)
目录 1.修改用户签名 2.取消用户签名 3.用户签名的优先级 4.总结本文用到的Git命令 1.修改用户签名 其实很简单,就是重新执行git config命令,换个用户名和邮箱地址就可以了,新配置的 ...
- input 标签的 pattern 属性
定义和用法 pattern 属性规定用于验证输入字段的模式. 模式指的是正则表达式. 注释:pattern 属性适用于以下 <input>类型:text, search, url, tel ...
- 基于casbin的RBAC权限实践
五一假期疫情封在家也没事做,就想来优化一下一个前端容器小项目 之前的TODOlist里面有一项是权限这块时隔2年了还一直没有动手 迟迟没搞主要还是我太懒了,哈哈 其实我一直想要找一个轻量级的权限通用方 ...