1500字范文,内容丰富有趣,写作好帮手!
1500字范文 > 通过经纬度获取OpenstreetMap 谷歌地图 高德地图的切片

通过经纬度获取OpenstreetMap 谷歌地图 高德地图的切片

时间:2021-03-21 23:08:50

相关推荐

通过经纬度获取OpenstreetMap 谷歌地图 高德地图的切片

直接复制代码放到本地运行即可

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>根据经纬度坐标获取对应的切片算法</title></head><script>function getPoints2() {var topTileFromX = -180;var topTileFromY = 90;var tdtScale = {18: 5.36441802978515E-06,17: 1.07288360595703E-05,16: 2.1457672119140625E-05,15: 4.29153442382814E-05,14: 8.58306884765629E-05,13: 0.000171661376953125,12: 0.00034332275390625,11: 0.0006866455078125,10: 0.001373291015625,9: 0.00274658203125,8: 0.0054931640625,7: 0.010986328125,6: 0.02197265625,5: 0.0439453125,4: 0.087890625,3: 0.17578125,2: 0.3515625,1: 0.703125};var strList = document.getElementById("content").value;var oStringList = strList.split(',');var level = oStringList[0];var lon = oStringList[1];var lat = oStringList[2];var coef = tdtScale[level] * 256;var x_num = Math.round((lon - topTileFromX) / coef);var y_num = Math.round((topTileFromY - lat) / coef);// var dir = "/DataServer?T=vec_c&";// var server = "l="+String(level)+"&"+"x="+String(x_num)+"&"+"y="+String(y_num);var dir = "/vec_c/wmts?SERVICE=WMTS&REQUEST=GetTile&STYLE=default&VERSION=1.0.0&LAYER=vec&TILEMATRIXSET=c&";var server = "TILEMATRIX=" + String(level) + "&" + "TILEROW=" + String(y_num) + "&" + "TILECOL=" + String(x_num) + "&FORMAT=tiles";var imageDir = dir + server;// alert(imageDir);var imgDiv = document.getElementById("map");imgDiv.style.backgroundImage = "url(" + imageDir + ")";}function lon2Mercator(px) {var x = px * 7508.3427892 / 180;return x;}function lat2Mercator(py) {var y;y = Math.log(Math.tan((90 + py) * Math.PI / 360)) / (Math.PI / 180);y = y * 7508.3427892 / 180;return y;}function getPoints3() {var topTileFromX = -7508.3427892;var topTileFromY = 7508.3427892;var tdtScale = {18: 0.597164283559817,17: 1.19432856685505,16: 2.38865713397468,15: 4.77731426794937,14: 9.55462853563415,13: 19.1092570712683,12: 38.2185141425366,11: 76.4370282850732,10: 152.8740565704,9: 305.7481128,8: 611.49622628138,7: 1222.99245256249,6: 2445.98490512499,5: 4891.96981024998,4: 9783.93962049996,3: 19567.8792409999,2: 39135.7584820001,1: 78271.5169639999};var strList = document.getElementById("content").value;var oStringList = strList.split(',');var level = oStringList[0];var lon = oStringList[1];var lat = oStringList[2];lon = lon2Mercator(parseFloat(lon));lat = lat2Mercator(parseFloat(lat));var coef = tdtScale[level] * 256;var x_num = Math.round((lon - topTileFromX) / coef);var y_num = Math.round((topTileFromY - lat) / coef);// var dir = "/DataServer?T=vec_c&";// var server = "l="+String(level)+"&"+"x="+String(x_num)+"&"+"y="+String(y_num);//var dir = "/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&STYLE=default&VERSION=1.0.0&LAYER=vec&TILEMATRIXSET=c&";// var server = "TILEMATRIX="+String(level)+"&"+"TILEROW="+String(y_num)+"&"+"TILECOL="+String(x_num)+"&FORMAT=tiles";var dir = "/DataServer?T=vec_w&";var server = "l=" + String(level) + "&" + "x=" + String(x_num) + "&" + "y=" + String(y_num);var imageDir = dir + server;var imgDiv = document.getElementById("map");imgDiv.style.backgroundImage = "url(" + imageDir + ")";}function getPoints4() {var topTileFromX = -7508.3427892;var topTileFromY = 7508.3427892;var tdtScale = {18: 0.597164283559817,17: 1.19432856685505,16: 2.38865713397468,15: 4.77731426794937,14: 9.55462853563415,13: 19.1092570712683,12: 38.2185141425366,11: 76.4370282850732,10: 152.8740565704,9: 305.7481128,8: 611.49622628138,7: 1222.99245256249,6: 2445.98490512499,5: 4891.96981024998,4: 9783.93962049996,3: 19567.8792409999,2: 39135.7584820001,1: 78271.5169639999};var strList = document.getElementById("content").value;var oStringList = strList.split(',');var level = oStringList[0];var lon = oStringList[1];var lat = oStringList[2];lon = lon2Mercator(parseFloat(lon));lat = lat2Mercator(parseFloat(lat));var coef = tdtScale[level] * 256;var x_num = Math.round((lon - topTileFromX) / coef);var y_num = Math.round((topTileFromY - lat) / coef);var dir = "http://a./";var server = String(level) + "/" + String(x_num) + "/" + String(y_num) + ".png";var imageDir = dir + server;var imgDiv = document.getElementById("map");imgDiv.style.backgroundImage = "url(" + imageDir + ")";}function getPoints5() {var topTileFromX = -7508.3427892;var topTileFromY = 7508.3427892;var tdtScale = {18: 0.597164283559817,17: 1.19432856685505,16: 2.38865713397468,15: 4.77731426794937,14: 9.55462853563415,13: 19.1092570712683,12: 38.2185141425366,11: 76.4370282850732,10: 152.8740565704,9: 305.7481128,8: 611.49622628138,7: 1222.99245256249,6: 2445.98490512499,5: 4891.96981024998,4: 9783.93962049996,3: 19567.8792409999,2: 39135.7584820001,1: 78271.5169639999};var strList = document.getElementById("content").value;var oStringList = strList.split(',');var level = oStringList[0];var lon = oStringList[1];var lat = oStringList[2];lon = lon2Mercator(parseFloat(lon));lat = lat2Mercator(parseFloat(lat));var coef = tdtScale[level] * 256;var x_num = Math.round((lon - topTileFromX) / coef);var y_num = Math.round((topTileFromY - lat) / coef);var dir = "/vt/lyrs=m@167000000&hl=zh-CN&gl=cn&";var server = "x=" + String(x_num) + "&" + "y=" + String(y_num) + "&" + "z=" + String(level) + "&s=Galil";var imageDir = dir + server;var imgDiv = document.getElementById("map");imgDiv.style.backgroundImage = "url(" + imageDir + ")";document.getElementById('map-text').value = imageDir;}function getPoints6() {var topTileFromX = -7508.3427892;var topTileFromY = 7508.3427892;var tdtScale = {18: 0.597164283559817,17: 1.19432856685505,16: 2.38865713397468,15: 4.77731426794937,14: 9.55462853563415,13: 19.1092570712683,12: 38.2185141425366,11: 76.4370282850732,10: 152.8740565704,9: 305.7481128,8: 611.49622628138,7: 1222.99245256249,6: 2445.98490512499,5: 4891.96981024998,4: 9783.93962049996,3: 19567.8792409999,2: 39135.7584820001,1: 78271.5169639999};var strList = document.getElementById("content").value;var oStringList = strList.split(',');var level = oStringList[0];var lon = oStringList[1];var lat = oStringList[2];lon = lon2Mercator(parseFloat(lon));lat = lat2Mercator(parseFloat(lat));var coef = tdtScale[level] * 256;var x_num = Math.round((lon - topTileFromX) / coef);var y_num = Math.round((topTileFromY - lat) / coef);var dir = "https://wprd04./appmaptile?lang=zh_cn&size=1&scl=1&style=8&ltype=11&";var server = "x=" + String(x_num) + "&" + "y=" + String(y_num) + "&" + "z=" + String(level) + "&s=Galil";var imageDir = dir + server;var imgDiv = document.getElementById("map");imgDiv.style.backgroundImage = "url(" + imageDir + ")";document.getElementById('map-text').value = imageDir;}</script><body><input id="content" type="text" autocomplete="on" maxlength="100" size="35"><!--<input type="button" value="获取天地图经纬度" onClick="getPoints2();"/><input type="button" value="获取天地图墨卡托" onClick="getPoints3();"/>--><input type="button" value="获取OpenstreetMap" onClick="getPoints4();"/><input type="button" value="获取谷歌地图" onClick="getPoints5();"/><input type="button" value="获取高德地图" onClick="getPoints6();"/><div id="map" style="width:256px; height: 256px;"></div><input type="text" id="map-text" style=" width: 1000px;"><script type="text/javascript">document.getElementById("content").value = "13,113.6,34.8";</script></body></html>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。