openlayers3中应用proj4js
要在openlayers3中应用proj4js,需要在html中引用proj4js,然后在引用所需要的projection的js定义,如 http://epsg.io/21781-1753.js
然后在openlayers中就会支持这种EPSG:21781的坐标转换。
<script src="http://cdnjs.cloudflare.com/ajax/libs/proj4js/2.2.1/proj4.js" type="text/javascript"></script>
<script src="http://epsg.io/21781-1753.js" type="text/javascript"></script>
http://epsg.io/21781-1753.js会返回一个js,这个js一旦执行就会给proj4添加一个支持的projection,如下:
proj4.defs("EPSG:21781","+proj=somerc +lat_0=46.95240555555556 +lon_0=7.439583333333333 +k_0=1 +x_0=600000 +y_0=200000 +ellps=bessel +towgs84=660.077,13.551,369.344,2.484,1.783,2.939,5.66 +units=m +no_defs");
下面是openlayer的实现
/**
* Fetches a Projection object for the code specified.
*
* @param {ol.proj.ProjectionLike} projectionLike Either a code string which is
* a combination of authority and identifier such as "EPSG:4326", or an
* existing projection object, or undefined.
* @return {ol.proj.Projection} Projection object, or null if not in list.
* @api stable
*/
ol.proj.get = function(projectionLike) {
var projection;
if (projectionLike instanceof ol.proj.Projection) {
projection = projectionLike;
} else if (goog.isString(projectionLike)) {
var code = projectionLike;
var projections = ol.proj.projections_;
projection = projections[code];
//判断proj4js被引入进来了
if (ol.ENABLE_PROJ4JS && !goog.isDef(projection) && typeof proj4 == 'function') {
//如果需要的code=EPSG被引入进来了,就会proj4.defs(code)返回定义,并加入到openlayers中
var def = proj4.defs(code);
if (goog.isDef(def)) {
var units = def.units;
if (!goog.isDef(units)) {
if (goog.isDef(def.to_meter)) {
units = def.to_meter.toString();
ol.proj.METERS_PER_UNIT[units] = def.to_meter;
}
}
projection = new ol.proj.Projection({
code: code,
units: units,
axisOrientation: def.axis
});
ol.proj.addProjection(projection);
var currentCode, currentDef, currentProj, proj4Transform;
for (currentCode in projections) {
currentDef = proj4.defs(currentCode);
if (goog.isDef(currentDef)) {
currentProj = ol.proj.get(currentCode);
if (currentDef === def) {
ol.proj.addEquivalentProjections([currentProj, projection]);
} else {
proj4Transform = proj4(currentCode, code);
ol.proj.addCoordinateTransforms(currentProj, projection,
proj4Transform.forward, proj4Transform.inverse);
}
}
}
} else {
goog.asserts.assert(goog.isDef(projection));
projection = null;
}
}
} else {
projection = null;
}
return projection;
openlayers3中应用proj4js的更多相关文章
- Openlayers3中实现地图的切割
概述: 本文讲述如何在Openlayers3中结合canvas实现对地图的切割. 效果: 全图 切割北京区域 切割河北区域 实现: <html xmlns="http://www.w3 ...
- Openlayers3中实现台风风圈绘制算法
概述: 台风的风圈的NE.NW.SW.SE四个方位的影响范围是不一致,本文介绍一种简单的风圈的绘制方法,并在OL3中展示. 实现效果: 实现代码: 1.数据格式 var Configs = { CIR ...
- OpenLayers3中wfs的属性查询
var vector = new ol.layer.Vector({ source: new ol.source.Vector({ format: new ol.format.GeoJSON(), u ...
- openLayers3 中实现多个Overlay
此篇的目的是为了记录下用Overlay的一些操作. 其实实现多个就是创建多个div,然后给每个div绑定Overlay. //页面加载完函数 --显示个关键点的名称 window.onload = f ...
- openlayers3中Overlay用法
Overlay 从名字看,是覆盖图.覆盖物的意思,主要的用途就是在地图之上再覆盖一层,用以显示额外的可见元素,可见元素一般是 HTML 元素,利用 overlay,可以将可见元素放置到地图的任意位置, ...
- 矢量切片(Vector tile)番外一:Proj4js
说明:番外篇是对正篇矢量切片(Vector tile)中提到的一些值得继续延伸的关注点继续进行探索和学习,所涉及的内容以解决实际问题为主要导向. 一.新的需求? 在完成了矢量切片的工作后,新的需求出现 ...
- 【GISER && Painter】矢量切片(Vector tile)番外一:Proj4js
说明:番外篇是对正篇矢量切片(Vector tile)中提到的一些值得继续延伸的关注点继续进行探索和学习,所涉及的内容以解决实际问题为主要导向. 一.新的需求? 在完成了矢量切片的工作后,新的需求出现 ...
- openlayers3应用一:显示百度地图
在项目中使用百度地图,最直接的方式是使用百度api,但是使用百度api需要申请key,并且某些功能调用有次数限制. 本文讲述在openlayers3中使用百度地图的方法.调用百度地图,也是经过了几番周 ...
- Openlayers2中统计图的实现
概述: 在前文中.介绍了Arcgis for js和Openlayers3中统计图的实现.在本文,书接上文.介绍在Openlayers2中,统计图的实现. 实现: 在Openlayers2中,popu ...
随机推荐
- Java中的IO流体系
Java为我们提供了多种多样的IO流,我们可以根据不同的功能及性能要求挑选合适的IO流,如图10-7所示,为Java中IO流类的体系. 注:这里只列出常用的类,详情可以参考JDK API文档.粗体标注 ...
- Java - 问题集 - 导出csv文件中文乱码
微软的excel文件需要通过文件头的bom来识别编码,所以写文件时,需要先写入bom头. FileOutputStream fos = new FileOutputStream(new File(&q ...
- EntityFramewrok 使用
1.使用一些查询比较复杂或者需要拼接的查询的时候最好一直保持IQueryable.一直到最后取数据的时候才进行查询.例如分页之类的条件拼接. var query = dbset.Where(expre ...
- 【java并发编程实战】第七章:取消与关闭
停止线程的几种方式 一般的逻辑停止 public class ThreadInterruptTest { public static volatile boolean cancel = true; p ...
- cpp语言程序设计教程第七章的一道编程题
题目如下 按下列要求实现一个有关学生成绩的操作. 该类名为Student. (1)每个学生的信息包含有姓名(字符数组)和成绩(int型). (2)共有5个学生,用对象数组表示. (3)计算出5个学生中 ...
- BZOJ 4592 SHOI2015 脑洞治疗仪 线段树
题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=4592 题意概述:需要维护一个01序列A,一开始A全部都是1.支持如下操作: 1.将区间[l ...
- js日期插件bootstrap-datetimepicker的使用
js日期插件——bootstrap-datetimepicker的使用心得: 在大多说的web项目中,都有日期选择器的使用.如果自己写一个日期选择器的话,费时又费力,而且不一定能写出来_(:3 」∠) ...
- antDesign DatePicker 禁用日期
const disabledDate = (current) => { return current < moment().subtract(29, 'days') || current ...
- 从零开始配置Jenkins(一)——基本配置
[背景] 由于项目变动,需要重新搭建jenkins环境,并在新搭建的平台下进行配置.之前,小编只是照猫画虎的用jenkins手动构建,虽然也维护过一段时间,但对于其中的原理并不是很了解.这下可好了,学 ...
- 【PHP】- include、require、include_once 和 require_once的区别
1.include:会将指定的档案读入并且执行里面的程序. 被导入的档案中的程序代码都会被执行,而且这些程序在执行的时候会拥有和源文件中呼叫到 include() 函数的位置相同的变量范围( ...