当地图的尺寸发生变化后，要调用map.updateSize()方法，强制使openlayers重新计算地图视口

updateSize()

Force a recalculation of the map viewport size. This should be called when third-party code changes the size of the map viewport.

强制重新计算地图的视口大小。此方法应该在第三方代码改变了地图视口的大小之后调用。比如我用vue，写了拖拽指令改变地图窗口的尺寸，导致了地图缩放偏移和长宽比失调

https://openlayers.org/en/latest/apidoc/module-ol_Map-Map.html#updateSize

当openlayers的地图所在的div的尺寸发生变化后，鼠标滚轮缩放地图发生偏移问题以及地图变形问题解决的更多相关文章

  1. 关于 WebBrowser调用百度地图API 鼠标滚轮缩放地图级别失灵的解决办法

    在桌面程序下 百度地图API的鼠标缩放地图功能可能会失灵无效! 这个原因不是API的问题 小弟试了下在WEB上面是没有问题的 于是考虑可能是WebBrowser的获取焦点问题,于是在主窗体 添加了一个 ...

  2. JS 实现DIV 滚动至顶部后固定

    JS 实现DIV 滚动至顶部后固定 <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8" ...

  3. 不偏移的天地图地图服务-ArcGIS版

    地图偏移和纠偏是使用在线电子地图不可避免的话题.研究不深入,暂且分享一种已纠偏的地图服务. 服务地址 直接放点干货: 影像地图: http://t0.tianditu.com/cia_w/esri/w ...

  4. 不偏移的天地图地图服务-SuperMap版

    在<不偏移的天地图地图服务-ArcGIS版>中,提供了相应的服务地址:而SuperMap中,则是将纠偏的方法集成到程序中,只需要修改一个配置参数,则可以实现天地图的纠偏. 打开Web型数据 ...

  5. jQuery事件-div的显示隐藏及鼠标的移入移出

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  6. 解决echart在IE中使用时，在div中加入postion后图表不显示问题

    <!-- 为ECharts准备一个具备大小(宽高)的Dom --> <div id="main" style="height:400px;width:1 ...

  7. 利用ArcEngine开发地图发布服务，将mxd文档一键发布成wmts，并根据需要对地图进行空间查询，返回客户端geojson

    一直想开发一个软件取代ArcGIS Server,该软件使用ArcEngine开发,以Windows Service形式发布,部署在服务端上,解决wmts地图服务发布和空间查询的问题,经过不断的研究. ...

  8. div 元素内容超出可通过鼠标滚轮实现横向滚动

    移动端中的元素内容超出时,对容器设置overflow-x: auto就可以通过手势水平移动.但是 PC 端只能通过鼠标滚轮上下滑动,而不能水平移动. 只需要给元素添加一个监听鼠标滚轮事件,上下滑动时修 ...

  9. 地图上显示div点位

    功能核心:  地理坐标转屏幕坐标 用到的插件:jquery  animo动画插件 核心代码: var point = new Point(lon, lat, map.spatialReference) ...

  10. 探讨把一个元素从它所在的div 拖动到另一个div内的实现方法

    故事背景: 接到一个新需求,要求用vue搞,主要是拖动实现布局,关键点有:单个组件拖动,一行多列里面的组件拖动,  单个组件可以拖入一行多列里, 单个组件的拖动好实现,关键是把一个组件拖动到另一个类似 ...

随机推荐

  1. 使用arcpy向server端发布服务

    import arcpy import os # Set output file names outdir = r"D:" service = "MapImageShar ...

  2. uniapp多次触发跳转问题

    问题描述:快速点击跳转页面后会闪退到登陆页面 解决方案:重新封装uniapp跳转api,加防抖锁,To.ts import { NavigateToOptions, RedirectToOptions ...

  3. windbg 调试 c++ std::exception

    由于c++ std::exception在windbg里面调用堆栈显示不正确,可以通过加载了系统pdb和软件pdb后,!analyze -v可以分析出来,所有需要配置系统pdb. 1.把exe,pdb ...

  4. cookie session token 发展史（便于理解jwt）

    目录 一.cookie session token 发展史(彻底理解cookie,session,token,便于理解jwt) 1.Cookie,Session,Token发展史 2.Cookie,S ...

  5. 创建LVM报错：Can't initialize physical volume "/dev/sdb1" of volume group "myvg" without -ff

    问题: 在使用fdisk /dev/sdb 删除原有LVM分区,在接着创建LVM新分区/dev/sdb1.完毕保存之后. 执行pvcreate /dev/sdb1出现报错 Can't initiali ...

  6. java 随机生成字符串 RandomStringUtils

    使用RandomStringUtils,可以选择生成随机字符串,可以是全字母.全数字或自定义生成字符等等... 其最基础的方法如下: public static String random(int c ...

  7. 【转】ReentrantReadWriteLock读写锁详解

    https://www.cnblogs.com/xiaoxi/p/9140541.html 一.读写锁简介 现实中有这样一种场景:对共享资源有读和写的操作,且写操作没有读操作那么频繁.在没有写操作的时 ...

  8. Qt编写地图综合应用40-覆盖物弧线

    一.前言 弧线可以用来指示某几个点直接弧形的方式绘制线条,尤其是飞机轨迹,起点到终点弧形曲线展示,更美观.百度地图的折线图.矩形图.圆形图等,都统称覆盖物,都是作为覆盖物绘制上去的,这样的好处是速度很 ...

  9. Qt编写百度地图综合应用（在线+离线+区域）

    一.前言 在现在很多的应用系统中,会提供一个地图模块,地图相关的应用和app也是非常多,最广泛的应用就属于导航,地图基本上分在线的和离线的两种,在线的一般都是实时的,数据也是最新的,速度很快路线很准, ...

  10. vue 控件的淡入淡出

    页面代码. 1.首先要用transition 包裹一下,设置name或者不设置都可以,其次transition 下面要有一个div设置v-if来触发移入移出 <transition name=& ...