OpenLayers学习笔记(九)— 限制地图显示范围
openlayers 3 地图上限制地图显示及拖动范围,坐标系是4326转3857,中心经纬度精确到小数点后六位,减少误差
GitHub:八至
作者:狐狸家的鱼
本文链接:ol3-限制地图显示及拖动范围

查看extent参数可以知道:

所以可以这样进行设置范围:
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学习笔记(九)— 限制地图显示范围的更多相关文章
- Windows phone 8 学习笔记(8) 定位地图导航
原文:Windows phone 8 学习笔记(8) 定位地图导航 Windows phone 8 已经不使用自家的bing地图,新地图控件可以指定制图模式.视图等.bing地图的定位误差比较大,在模 ...
- 多线程学习笔记九之ThreadLocal
目录 多线程学习笔记九之ThreadLocal 简介 类结构 源码分析 ThreadLocalMap set(T value) get() remove() 为什么ThreadLocalMap的键是W ...
- MDX导航结构层次:《Microsoft SQL Server 2008 MDX Step by Step》学习笔记九
<Microsoft SQL Server 2008 MDX Step by Step>学习笔记九:导航结构层次 SQL Server 2008中SQL应用系列及BI笔记系列--目录索 ...
- python3.4学习笔记(九) Python GUI桌面应用开发工具选择
python3.4学习笔记(九) Python GUI桌面应用开发工具选择 Python GUI开发工具选择 - WEB开发者http://www.admin10000.com/document/96 ...
- Go语言学习笔记九: 指针
Go语言学习笔记九: 指针 指针的概念是当时学C语言时了解的.Go语言的指针感觉与C语言的没啥不同. 指针定义与使用 指针变量是保存内存地址的变量.其他变量保存的是数值,而指针变量保存的是内存地址.这 ...
- go微服务框架kratos学习笔记九(kratos 全链路追踪 zipkin)
目录 go微服务框架kratos学习笔记九(kratos 全链路追踪 zipkin) zipkin使用demo 数据持久化 go微服务框架kratos学习笔记九(kratos 全链路追踪 zipkin ...
- ArcGIS API for JavaScript 4.2学习笔记[1] 显示地图
ArcGIS API for JavaScript 4.2直接从官网的Sample中学习,API Reference也是从官网翻译理解过来,鉴于网上截稿前还没有人发布过4.2的学习笔记,我就试试吧. ...
- Python学习笔记九
Python学习笔记之九 为什么要有操作系统 管理硬件,提供接口. 管理调度进程,并且将多个进程对硬件的竞争变得有序. 操作系统发展史 第一代计算机:真空管和穿孔卡片 没有操作系统,所有的程序设计直接 ...
- OpenLayers学习笔记4——使用jQuery UI实现測量对话框
OpenLayers学习最好的方式就是跟着其自带的演示样例进行学习,另外对web前端的开发设计要了解,慢慢积累,这样在一般的小项目中应该是足够用了. 本篇參照量測demo实现对话框形式的量測,抛砖引玉 ...
- vue学习笔记(九)vue-cli中的组件通信
前言 在上一篇博客vue学习笔记(八)组件校验&通信中,我们学会了vue中组件的校验和父组件向子组件传递信息以及子组件通知父组件(父子组件通信),上一篇博客也提到那是对组件内容的刚刚开始,而本 ...
随机推荐
- 在angular 6中使用 less
在angular 6中使用 less 新项目 ng new [appname] --style less 已有的项目 修改 *.css 文件及引用处后缀名为 less并在 angular.json 文 ...
- WordCount结对项目
合作者:201631062124,201631062423 代码地址:https://gitee.com/yryx/WordCount 作业地址:https://edu.cnblogs.com/cam ...
- 修改vue element Transfer 穿梭框里内容区的宽度
<template> <el-transfer v-model="value1" :data="data"></el-transf ...
- jenkins安装详细教程
一.jenkins简介 jenkins是一个开源的软件项目,是基于java开发的一种持续集成工具,用于监控持续重复的工作,旨在提供一个开放易用的软件平台,使软件的持续集成变成可能. 1.持续的软件版本 ...
- MySQL 数据库的创建&修改
-- 创建数据库 CREATE DATABASE [IF NOT EXISTS]<数据库名> DEFAULT CHARACTER SET utf8; -- 默认字符集为utf8 -- 指定 ...
- eclipse 中 git 解决冲突(重点)
Eclipse 中 GIT 提交代码时的冲突困扰了我很久,说实在的,真的感觉 GIT 太特么难用了,尤其是提交代码时(或许还没习惯吧).特此,写一篇博文记录一下自己使用 GIT 决解冲突的问题,希望能 ...
- Django--用户认证组件auth(登录用-依赖session,其他用)
一.用户认证组件auth介绍 二.auth_user表添加用户信息 三.auth使用示例 四.auth封装的认证装饰器 一.用户认证组件auth介绍 解决的问题: 之前是把is_login=True放 ...
- Redis学习笔记(5)——Redis数据持久化
出处http://www.cnblogs.com/xiaoxi/p/7065328.html 一.概述 Redis的强大性能很大程度上都是因为所有数据都是存储在内存中的,然而当Redis重启后,所有存 ...
- js前端导出Excel表格后数字自动变成科学计数法问题
一般的文件导出都是后端进行导出,最近一个项目遇到导出接口挂掉了,前端实现导出的情况. 背景是vue框架,iView组件.可以直接使用exportCsv方法进行导出. 导出时进行一下行和列的切割就可以了 ...
- C# for循环或者foreach往List中添加对象的时候前面的数据总被最后加入的覆盖
昨天我旁边小姐姐遇到一个问题,就是在执行for循环往list添加数据的时候,前面的数据信息总是被后面的数据信息所覆盖. 这样编写就会造成这样的数据效果:(所有的数据都会被覆盖) 问题原因:对 ...