由于某些库(prototype.js 和 pro4js)之间的冲突,我需要重写 OpenLayers 的函数。但即使我尝试使用与他们的 github 上完全相同的代码,结果也与我在不重写函数的情况下得到的不同。
在我的情况下,想要重新编码的功能register()
来自ol/proj/proj4
这是使用此函数的重投影示例:
proj4.defs('EPSG:27572', "+title=NTF (Paris) / Lambert zone II +proj=lcc +lat_1=46.8 +lat_0=46.8 +lon_0=0 +k_0=0.99987742 +x_0=600000 +y_0=2200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs");
ol.proj.proj4.register(proj4);
proj = ol.proj.get('EPSG:27572');
var map = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
}),
],
target: 'map',
view: new ol.View({
projection: proj,
center: [0, 0],
zoom: 1
})
});
<!DOCTYPE html>
<html lang="en">
<head>
<title>Reprojection</title>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.1.1/css/ol.css">
<script type="text/javascript" src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.1.1/build/ol.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.5.0/proj4.js"></script>
<style>
.map {
width: 600px;
height:400px;
}
</style>
</head>
<body>
<div id="map" class="map"></div>
</body>
</html>
但是如果我重新编码这个函数(根据这个来源:https ://github.com/openlayers/openlayers/blob/master/src/ol/proj/proj4.js ),我定义的投影对除了完全模糊地图之外的 ol 地图(但我想这是我的主要问题的副作用,因为模糊地图大部分时间是由于重投影问题):
ol.proj.proj4.register = function(proj4) {
const projCodes = Object.keys(proj4.defs);
const len = projCodes.length;
let i, j;
for (i = 0; i < len; ++i) {
const code = projCodes[i];
if (!ol.proj.get(code)) {
const def = proj4.defs(code);
ol.proj.addProjection(new ol.proj.Projection({
code: code,
axisOrientation: def.axis,
metersPerUnit: def.to_meter,
units: def.units
}));
}
}
for (i = 0; i < len; ++i) {
const code1 = projCodes[i];
const proj1 = ol.proj.get(code1);
for (j = 0; j < len; ++j) {
const code2 = projCodes[j];
const proj2 = ol.proj.get(code2);
if (!ol.proj.getTransform(code1, code2)) {
if (proj4.defs[code1] === proj4.defs[code2]) {
ol.proj.addEquivalentProjections([proj1, proj2]);
} else {
const transform = proj4(code1, code2);
ol.proj.addCoordinateTransforms(proj1, proj2, transform.forward, transform.inverse);
}
}
}
}
}
proj4.defs('EPSG:27572', "+title=NTF (Paris) / Lambert zone II +proj=lcc +lat_1=46.8 +lat_0=46.8 +lon_0=0 +k_0=0.99987742 +x_0=600000 +y_0=2200000 +a=6378249.2 +b=6356515 +towgs84=-168,-60,320,0,0,0,0 +pm=paris +units=m +no_defs");
ol.proj.proj4.register(proj4);
proj = ol.proj.get('EPSG:27572');
var map = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
}),
],
target: 'map',
view: new ol.View({
projection: proj,
center: [0, 0],
zoom: 1
})
});
<!DOCTYPE html>
<html lang="en">
<head>
<title>Reprojection</title>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.1.1/css/ol.css">
<script type="text/javascript" src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.1.1/build/ol.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.5.0/proj4.js"></script>
<style>
.map {
width: 600px;
height:400px;
}
</style>
</head>
<body>
<div id="map" class="map"></div>
</body>
</html>
有人可以向我解释我哪里错了吗?当然,如果您对从库中重写函数有更好的想法,我也会喜欢它!
顺便说一句:出于好奇,我试图面对的冲突是因为prototype.js 为对象添加了额外的属性。我对这个框架知之甚少,我没有手或删除它的选择。由于该函数使用ol.proj.proj4.register()
检索投影代码Object.keys()
,因此它实际上检索到的代码比那些代码多得多,因为原型.js。当然会产生错误。