说明:

在做项目过程中,用overlay做了一个infowindow弹窗,但是在使用过程中发现一个bug:overlay.setPosition以后,会出现偏移,但是拖动一下地图或者点击一下地图其他地方就回到正确的位置。

代码如下:

            let overlay = new ol.Overlay({
id: "overlay",
element: "marks",
positioning: "bottom-center",
stopEvent: _stopEvent ? _stopEvent : false
});

过程:

研究发现positioning改成默认(top-left)就没问题,紧接着试了其他几个参数center-center,bottom-left等,凡是设了center的都会有这个问题。

#参数:'bottom-left''bottom-center''bottom-right''center-left''center-center''center-right''top-left''top-center''top-right'

推测overlay在渲染center时有点bug

解决方案:

将overlay的positioning设置在加载后,即可

            let overlay = new ol.Overlay({
id: "overlay",
element: "marks",
//positioning: _position, //这里注释掉
stopEvent: _stopEvent ? _stopEvent : false
});
overlay.setPosition([_x,_y]);
map.addOverlay(overlay);
//解决overlay渲染center时出现偏移的问题
overlay.setPositioning("bottom-center");

Openlayers Overlay导致偏移的更多相关文章

  1. Openlayers Overlay加载gif图片

    说明: 项目中使用vector图层做图片撒点功能,发现加载gif没有效果.网上查找资料发现,openlayers不支持gif图片样式. 后面采用overlay的方式,gif图片赋值给DOM元素 解决方 ...

  2. Openlayers Overlay使用心得

    Overlay在Openlayers里是浮动层的概念,区别于vector这样的图层,通常用于弹窗.撒点.以及解决加载icon样式不支持的gif等格式图片. 此次用overlay的过程中遇到很多问题,在 ...

  3. Openlayers Projection导致经纬度颠倒问题

    问题: openlayers3调用TileWMS接口,实现Openlayers加载Geoserver转发的ArcGIS切片时,web墨卡托(wkid3857)没有问题,但是WGS84(wkid4326 ...

  4. Unity3D 利用欧拉角实现实体的旋转

    本文系作者原创,转载请注明出处 刚刚入门U3D,也是很多东西搞不懂,最先接触的就是自己尝试去获取键盘上的GetPress之类的事件了吧 官方的API DOC也是帮了不少忙,到处吸收了各位博主的文章也是 ...

  5. 样式布局与 BFC

    一.几类视图 内联视图:inline 单行 块级视图:block 换行,有高度 行内块级视图:inline-block 单行,有高度 二.几类布局 块级布局 换行,通过设置 margin 水平居中 & ...

  6. oo第一次作业

    前言: 这是一篇面向对象作业总结,作业内容是对多项式进行求导,一共有三个阶段,具体要求不详述,第一阶段只要求’+’连接coeff*x^pow的形式,第二次支持*连接的幂函数及三角函数,第三次则需要支持 ...

  7. U3D Transform用法

    最近在学习unity3d,下面对Transform类做一个小结 一.常用属性和方法 1.1 常用属性: 用代码展示一下上面的一些属性,值得注意的是myCube是mySphere的父物体 using U ...

  8. 在WPF中实现平滑滚动

    WPF实现滚动条还是比较方便的,只要在控件外围加上ScrollViewer即可,但美中不足的是:滚动的时候没有动画效果.在滚动的时候添加过渡动画能给我们的软件增色不少,例如Office 2013的滚动 ...

  9. lua垃圾回收之空表

    故事背景: 自己手动手写的一个lua外部库luaopen_xxx,采用了tolua++1.0.93,编译后得到xxx.dll,当在luajit中require 'xxx'后是正常的,但如果运行环境换成 ...

随机推荐

  1. [AHOI2002]网络传输

    这道题根据题意,易知k的幂与p的二进制形式有关系,然后再一波高精度即可.(这里我用$n.k$代替了$k.p$) #include <iostream> #include <cstdi ...

  2. Java TCP协议字节处理工具类

    1.使用 tcp 协议 读取 输入流的固定长度的字节数 public static byte[] getTcpSpecificBytes(BufferedInputStream bis,int len ...

  3. SQL注入学习(一)

    SQL注入(SQL Injection)是一种常见的Web安全漏洞,攻击者利用这个漏洞,可以访问或修改数据,或者利用潜在的数据库漏洞进行攻击. SQL注入基础 漏洞原理 针对SQL注入的攻击行为可描述 ...

  4. 前后端分离,转json格式问题

    json格式是字符串形式,将数据库中的数据取出来转为json格式时,要将小数等数据转位字符串(str方法) 报错类型: 1,decimal(5,2)  表示5位数,其中小数有两位,decimal要转为 ...

  5. iOS和macOS上的Message-ID和Mail.app深度链接

    如何在iOS上通过电子邮件进行无缝的“无密码”身份验证. Apple平台上的邮件和日历集成 在macOS和iOS上查看电子邮件时,邮件会在[检测到的日期和时间]下划线 .您可以与他们互动以创建新的日历 ...

  6. USDT跑分系统开发

    USDT跑分系统开发找[林生:178-7666-2415微/电],USDT跑分系统开发,USDT跑分系统解决方案,USDT跑分系统定制,小程序开发.APP.公众号等软件开发. 数字资产结算通道的特点: ...

  7. Pandas文本数据处理

    先初始化数据 import pandas as pd import numpy as np index = pd.Index(data=["Tom", "Bob" ...

  8. 20190630模拟赛B(单调队列优化dp)

    .dp无疑了其实. 在考场上,我写了一个错解,但是数据小都能过,只是会爆空间,考场上想着怎么用滚动数组优化来着....把错解的方程列出来吧 ;i<=n;i++) { ;j<=k;j++) ...

  9. 通过ISO镜像简单搭建本地yum仓库

    本文参考链接:https://segmentfault.com/a/1190000015155966 *有时候在我们本地搭建一些Linux上的程序运行环境或者安装一些软件的时候,难免会遇到需要使用yu ...

  10. linux 打包 | autoconf 使用方法

    面试题 嵌入式 0x10道题目 宏定义 #define 宏体 宏体 (大写) #define SECOND_OF_YEAR (365*24*3600)UL 可移植性 数据声明 一个存有10个指针的数组 ...