说明:

在地图操作中,有个功能,需要点击一个点,将视图定位到点击点的位置,并放大。

解决方案:

1、可以有openlayers中可以有ol.View来控制,但是在更改时,会将地图初始化时设置的maxZoom,minZoom等覆盖掉,因此需要在设置新的view前,重新设置一次初始化时的值,避免重复覆盖。

    /**
* @description 地图定位中心并缩放事件
* @param {Map} _map 地图对象
* @param {Feature} _feature 要定位的要素
* @param {Number} _zoomLevel 缩放层级
*/
this.zoomAndCenter = function (_map, _feature, _zoomLevel) {
var my_view = new ol.View({
center: ol.extent.getCenter(_feature.getGeometry().getExtent()),//格式:[x,y]
zoom: _zoomLevel,
minZoom: _map.encmap.getView().getMinZoom(),
maxZoom: _map.encmap.getView().getMaxZoom()
});
_map.encmap.setView(my_view);
};

2、单独设置中心和缩放,推荐!

let view = _map.encmap.getView();
view.setZoom(_zoomLevel);
view.setCenter(ol.extent.getCenter(_feature.getGeometry().getExtent()));

Openlayers 地图定位到相应位置并缩放的更多相关文章

  1. Android应用中使用百度地图API定位自己的位置(二)

    官方文档:http://developer.baidu.com/map/sdkandev-6.htm#.E7.AE.80.E4.BB.8B3 百度地图SDK为开发人员们提供了例如以下类型的地图覆盖物: ...

  2. Android使用百度地图定位并显示手机位置后使用前置摄像头“偷拍”

    今天老板让我验证一下技术可行性,记录下来. 需求 :定位手机的位置并在百度地图上显示,得到位置后使用前置摄像头进行抓拍 拿到这个需求后,对于摄像头的使用不太熟悉,于是我先做了定位手机并在百度地图上显示 ...

  3. html5定位获取当前位置并在百度地图上显示

    用html5的地理定位功能通过手机定位获取当前位置并在地图上居中显示出来,下面是百度地图API的使用过程,有需要的朋友可以参考下 在开发移动端 web 或者webapp时,使用百度地图 API 的过程 ...

  4. 完整版百度地图点击列表定位到对应位置并有交互动画效果demo

    1.前言 将地图嵌入到项目中的需求很多,好吧,我一般都是用的百度地图.那么今天就主要写一个完整的demo.展示一个列表,点击列表的任一内容,在地图上定位到该位置,并有动画效果.来来来,直接上demo  ...

  5. Android 百度地图定位(手动+自动) 安卓开发教程

    近由于项目需要,研究了下百度地图定位,他们提供的实例基本都是用监听器实现自动定位的.我想实现一种效果:当用户进入UI时,不定位,用户需要定位的时候,自己手动点击按钮,再去定位当前位置.  经过2天研究 ...

  6. HTML5 Geolocation用来定位用户的位置。

    HTML5 Geolocation用来定位用户的位置. 定位用户的位置 HTMl5 Geolocation API用来得到用户的地理位置. 由于这个可能和个人隐私相关.除非用户同意否则不能使用. 浏览 ...

  7. 使用高德地图JS获取当前位置和经纬度

    先看效果,我做的是这样的,可以按地图位置来返回当前你点的位置(图一,二),也可以根据输入框的自动搜索(图三,四) HTML的代码: <div> <input type="t ...

  8. (十八)WebGIS中清空功能和地图定位功能的设计以及实现

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 当地图中增加了很多元素后,对不同的元素需要进行一定的控制,最 ...

  9. Android之仿ele地图定位效果

    PS:最近项目要求,希望在选择地址的时候能够仿ele来实现定位效果.因此就去做了一下.不过ele使用高德地图实现的,我是用百度地图实现的.没办法,公司说用百度那就用百度的吧.个人觉得高德应该更加的精准 ...

随机推荐

  1. 百万年薪python之路 -- 面向对象之三大特性

    1.面向对象之三大特性 1.1封装 封装:就是把一堆代码和数据,放在一个空间,并且可以使用 对于面向对象的封装来说,其实就是使用构造方法将内容封装到 对象 中,然后通过对象直接或者self间接获取被封 ...

  2. Python字典及相关操作(内含例题)

    Python字典类型 今天将会介绍一种在python中十分常见的组合数据类型——字典 通过一些实例来理解字典中的常规操作 什么是字典类型? 列表中查找是通过整数的索引(元素在列表中的序号)来实现查找功 ...

  3. vue 动态数据绑定

    动态数据绑定(一) 我的github iSAM2016 实现的步骤: 1.监听对象属性的读取与变化 Object.defineProperty() 方法会直接在对象上定义一个新的的属性,或者已经存在的 ...

  4. Java线程池的正确关闭方法,awaitTermination还不够

    问题说明 今天发现了一个问题,颠覆了我之前对关闭线程池的认识. 一直以来,我坚信用shutdown + awaitTermination关闭线程池是最标准的方式. 不过,这次遇到的问题是,子线程用到B ...

  5. JavaWeb 如何防止表单重复提交 - 使用Token,令牌

    JavaWeb 如何防止表单重复提交 - 使用Token,令牌 说到重复提交 ,应该想到两种场景:1. 在下单,或者支付 这种情况 那么不允许  刷新,不允许后退再点击提交(后退之后提交会失败,修改了 ...

  6. numpy+pandas+ matplotlib模块(day18)

    目录 numpy模块 二维数组 numpy数组的属性 T 数组的装置 dtype 数组元素的数据类型 size 数组元素的个数 ndim 数组的维数 shape数组的维度大小 astype 类型转换 ...

  7. python:将网页图片保存到本地

    1.requests库介绍 在python中,有一个非常好用的网络请求库requests,使用它可以发起网络请求,并获取网页返回的内容.同时,也可以进行网页图片下载 requests是使用Apache ...

  8. 使用float设置经典的网站前端结构(深入探讨)

    .要是DIV的子元素宽度大于它自己的宽度,不管子元素有没有脱离文档流,子元素会在横向向右溢出. 关于高度:1.要是DIV的高度没有设定,其高度受“没有脱离文档流”的子元素影响.以下是DIV宽度为0的情 ...

  9. Asp.net Core 系列之--2.ORM初探:Dapper实现MySql数据库各类操作

    ChuanGoing 2019-09-10 距离上一篇近一个月时间,断断续续才把本篇码完,后面将加快进度,争取年度内把本系列基本介绍完成,同时督促本人持续学习. 本篇学习曲线: 1.初识Dapper ...

  10. ElasticSearch(五):Mapping和常见字段类型

    ElasticSearch(五):Mapping和常见字段类型 学习课程链接<Elasticsearch核心技术与实战> 什么是Mapping Mapping类似数据库中的schema的定 ...