Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
506 views
in Technique[技术] by (71.8m points)

javascript - 尝试重新编码OpenLayers函数时发生重新投影问题(Reprojection issue while trying to recode an OpenLayers function)

Because of conflicts between some libraries (prototype.js and pro4js) i need to rewrite a function of OpenLayers.

(由于某些库(prototype.js和pro4js)之间的冲突,我需要重写OpenLayers的功能。)

But even when i try to use the exact same code than on their github, the result differs from the one i get without rewriting the function.

(但是,即使我尝试使用与其github上使用的代码完全相同的代码,其结果也与不重写该函数而得到的结果有所不同。)

In my case the function in want to recode is register() from ol/proj/proj4

(在我的情况下,要重新编码的功能是ol/proj/proj4 register())

Here is a reprojection example using this function :

(这是使用此功能的重新投影示例:)

 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> 

But then if i recode this function (according to this source : https://github.com/openlayers/openlayers/blob/master/src/ol/proj/proj4.js ), the projection i defined does not have any effect on the ol map except totaly blurring the map ( but i guess this is a side effect of my main problem since blurry maps are most of the time du to reprojection issue ) :

(但是然后如果我重新编码此函数(根据此源: 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> 

Can someone explain to me where i am wrong ?

(有人可以向我解释我错了吗?)

And of course if you have a better idea for rewriting a function from a library i would enjoy it also !

(当然,如果您有一个更好的主意来从库中重写函数,我也将很高兴!)

BTW : For curious, the conflict i try to face is because prototype.js adds extra properties to objects.

(顺便说一句:出于好奇,我尝试面对的冲突是因为prototype.js为对象添加了额外的属性。)

I don't know a lot about this framework and I don't have the hand on it or the choice to remove it.

(我对这个框架不了解很多,也没有帮助,也没有删除它的选择。)

Since the function ol.proj.proj4.register() retrieves projection codes with Object.keys() , it actually retrieves much more than those codes because of prototype.js.

(由于函数ol.proj.proj4.register()使用Object.keys() ol.proj.proj4.register()检索投影代码,因此,由于prototype.js,它实际上比这些代码检索的内容更多。)

And of course generates an error.

(当然会产生错误。)

  ask by PopHip translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)
等待大神答复

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...