OpenLayers学习笔记(九)— 限制地图显示范围

时间:2023-01-08 16:30:01

openlayers 3 地图上限制地图显示及拖动范围,坐标系是4326转3857,中心经纬度精确到小数点后六位,减少误差

GitHub:八至

作者:狐狸家的鱼

本文链接:ol3-限制地图显示及拖动范围

OpenLayers学习笔记(九)— 限制地图显示范围

查看extent参数可以知道:

OpenLayers学习笔记(九)— 限制地图显示范围

所以可以这样进行设置范围:

var view = new ol.View({
...
extent: [minx,miny,maxx,maxy]
...
});
var map = new ol.Map({
...
view: view,
...
});

并且需要考虑地图投影,比如在WGS84和球形墨卡托之间,有一个转换方案:

var map = new ol.Map({
.
.
.
view: new ol.View({
extent: ol.proj.transfromExtent([minx, miny, maxx, maxy], 'EPSG:4326', 'EPSG:3857');
.
.
.
)}
)}

而当缩放地图时,显示的范围不是我们想要的结果,可以限制缩放层级,这是另一种选择:

...
var map = new ol.Map({
layers: [...],
overlays: [...],
target: document.getElementById('map'),
view: new ol.View({
center: ol.proj.transform([minx,miny,maxx,maxy],
'EPSG:4326', 'EPSG:3857'),
zoom: ...,
maxZoom: ...,
minZoom: ...,
extent: ol.proj.transform([minx-n,miny-n,maxx+n,maxy+n],
'EPSG:4326', 'EPSG:3857')
})
});
...

OpenLayers学习笔记(九)— 限制地图显示范围的更多相关文章

  1. Windows phone 8 学习笔记(8) 定位地图导航

    原文:Windows phone 8 学习笔记(8) 定位地图导航 Windows phone 8 已经不使用自家的bing地图,新地图控件可以指定制图模式.视图等.bing地图的定位误差比较大,在模 ...

  2. 多线程学习笔记九之ThreadLocal

    目录 多线程学习笔记九之ThreadLocal 简介 类结构 源码分析 ThreadLocalMap set(T value) get() remove() 为什么ThreadLocalMap的键是W ...

  3. MDX导航结构层次:《Microsoft SQL Server 2008 MDX Step by Step》学习笔记九

    <Microsoft SQL Server 2008 MDX Step by Step>学习笔记九:导航结构层次   SQL Server 2008中SQL应用系列及BI笔记系列--目录索 ...

  4. python3&period;4学习笔记&lpar;九&rpar; Python GUI桌面应用开发工具选择

    python3.4学习笔记(九) Python GUI桌面应用开发工具选择 Python GUI开发工具选择 - WEB开发者http://www.admin10000.com/document/96 ...

  5. Go语言学习笔记九: 指针

    Go语言学习笔记九: 指针 指针的概念是当时学C语言时了解的.Go语言的指针感觉与C语言的没啥不同. 指针定义与使用 指针变量是保存内存地址的变量.其他变量保存的是数值,而指针变量保存的是内存地址.这 ...

  6. go微服务框架kratos学习笔记九&lpar;kratos 全链路追踪 zipkin&rpar;

    目录 go微服务框架kratos学习笔记九(kratos 全链路追踪 zipkin) zipkin使用demo 数据持久化 go微服务框架kratos学习笔记九(kratos 全链路追踪 zipkin ...

  7. ArcGIS API for JavaScript 4&period;2学习笔记&lbrack;1&rsqb; 显示地图

    ArcGIS API for JavaScript 4.2直接从官网的Sample中学习,API Reference也是从官网翻译理解过来,鉴于网上截稿前还没有人发布过4.2的学习笔记,我就试试吧. ...

  8. Python学习笔记九

    Python学习笔记之九 为什么要有操作系统 管理硬件,提供接口. 管理调度进程,并且将多个进程对硬件的竞争变得有序. 操作系统发展史 第一代计算机:真空管和穿孔卡片 没有操作系统,所有的程序设计直接 ...

  9. OpenLayers学习笔记4——使用jQuery UI实现測量对话框

    OpenLayers学习最好的方式就是跟着其自带的演示样例进行学习,另外对web前端的开发设计要了解,慢慢积累,这样在一般的小项目中应该是足够用了. 本篇參照量測demo实现对话框形式的量測,抛砖引玉 ...

  10. vue学习笔记&lpar;九&rpar;vue-cli中的组件通信

    前言 在上一篇博客vue学习笔记(八)组件校验&通信中,我们学会了vue中组件的校验和父组件向子组件传递信息以及子组件通知父组件(父子组件通信),上一篇博客也提到那是对组件内容的刚刚开始,而本 ...

随机推荐

  1. UWP开发之Template10实践:本地文件与照相机文件操作的MVVM实例&lpar;图文付原代码&rpar;

    前面[UWP开发之Mvvmlight实践五:SuspensionManager中断挂起以及复原处理]章节已经提到过Template10,为了认识MvvmLight的区别特做了此实例. 原代码地址:ht ...

  2. linear-gradient----渐变

    CSS3 渐变(gradient)可以让你在两个或多个指定的颜色之间显示平稳的过渡. 以前,你必须使用图像来实现这些效果,现在通过使用 CSS3 的渐变(gradients)即可实现.此外,渐变效果的 ...

  3. 高性能javascript学习笔记系列&lpar;1&rpar; -js的加载和执行

    这篇笔记的内容主要涉及js的脚本位置,如何加载js脚本和脚本文件执行的问题,按照自己的理解结合高性能JavaScript整理出来的 javascript是解释性代码,解释性代码需要经历转化成计算机指令 ...

  4. Android应用安全之Android APP通用型拒绝服务漏洞

    0xr0ot和Xbalien交流所有可能导致应用拒绝服务的异常类型时,发现了一处通用的本地拒绝服务漏洞.该通用型本地拒绝服务可以造成大面积的app拒绝服务. 针对序列化对象而出现的拒绝服务主要是由于应 ...

  5. SharePoint 2013 重复的管理账户错误:已添加项。字典中的关键字 所添加的关键字

    博客地址:http://blog.csdn.net/FoxDave 今天在管理中心创建新的Web应用程序时,想注册一个新的管理账户,一着急点了两次按钮,结果就出现了这样的错误...怎么说呢,太奇葩 ...

  6. 如何用C&num;语言构造蜘蛛程序

    "蜘蛛"(Spider)是Internet上一种很有用的程序,搜索引擎利用蜘蛛程序将Web页面收集到数据库,企业利用蜘蛛程序监视竞争对手的网站并跟踪变动,个人用户用蜘蛛程序下载We ...

  7. 游戏基础元素——Cocos2d-x学习历程&lpar;八&rpar;

    1.Director:导演 从字面上理解,这是一个"导演"类,Director是控制游戏流程的主要组件.CCDirector的工作确实跟导演非常类似,主要负责以下工作: 游戏呈现方 ...

  8. WC2019游记 &amp&semi;&amp&semi; 课件

    WC2019 游记 课件 wc2019.zip_免费高速下载|百度网盘-分享无限制 提取码: un6z day 0 打飞机去广州... 在飞机上刷了爱乐(le)之城, 相当好看... 广二好大! 哈三 ...

  9. oracle单行函数 之 字符函数

    Upper(字符串 / 列):将输入的字符串变成大写 Lower(字符串 / 列):将输入的字符串变成小写 Initcap(字符串 / 列):开头首字母大写 Length(字符串 / 列):字符串长度 ...

  10. Quartz —— 任务调度框架

    一.Quartz Quartz 是 OpenSymphony 开源组织在任务调度领域的一个开源项目,完全基于 Java 实现.该项目于 2009 年被 Terracotta 收购,目前是 Terrac ...