openLayers TMS加载谷歌地图瓦片
2014-04-25 16:01
225 查看
openLayers TMS中加载谷歌瓦片 经纬坐标(LonLat)
和投影坐标系的转换
http://www.cnblogs.com/sailheart/archive/2011/03/11/1981536.html 读读这篇文章
<script type="text/javascript">
/**
openLayer根据TMS加载谷歌地图瓦片
(1)先去下载加载谷歌地图瓦片,这样的软件有(水经注,google Map downloder,openLayersz中国官网提供的开源的软件)
(2)把下载的瓦片放到本地服务器上,最重要的是根据URL找到该瓦片
**/
var map, layer; //complex object of type OpenLayers.Map
function init() {
map = new OpenLayers.Map("map",
{
maxExtent: new OpenLayers.Bounds(-20037508.3427892,-20037508.3427892,20037508.3427892,20037508.3427892), //地图表示最大范围(左, 下, 右, 上) ,可以作为默认值
numZoomLevels:16, //地图缩放的最大级别(根据自己的实际需求设置)
maxResolution : 156543.0339, //地图缩最大像素,(默认)
units:'m', //地图单位米(默认)
projection: "EPSG:900913",//采用投影坐标系(默认)
displayProjection: new OpenLayers.Projection("EPSG:4326")//采用经纬度坐标系(默认)
}
);
layer = new OpenLayers.Layer.TMS("Name",
"http://127.0.0.1:9080/openLayers/", {
'type' : 'png',
'getURL' : get_my_url
});
map.addLayer(layer);
map.addControl(new OpenLayers.Control.Scale());
map.addControl(new OpenLayers.Control.MousePosition());
map.addControl(new OpenLayers.Control.LayerSwitcher());
//设置地图的显示的中间位置及缩放级别
var lonLat = new OpenLayers.LonLat(116.20101928710937,39.768436410838426); //下载瓦片的坐标
lonLat.transform(map.displayProjection, map.getProjectionObject()); //经纬度坐标和投影坐标的转换
map.setCenter(lonLat,10); //设置地图的显示的中间位置及缩放级别
}
function get_my_url(bounds) {
var res = this.map.getResolution();
var x = Math.round((bounds.left - this.maxExtent.left)
/ (res * this.tileSize.w));
var y = Math.round((this.maxExtent.top - bounds.top)
/ (res * this.tileSize.h));
var z = this.map.getZoom();
//本地服务器下瓦片的文件目录已经文件名(URL)
var path = "/openLayersTest/data/ol/bj/" + z + "/" + x +"/" + y+"." + this.type;
var url = this.url;
if (url instanceof Array) {
url = this.selectUrl(path, url);
}
return url + path;
}
</script>
和投影坐标系的转换
http://www.cnblogs.com/sailheart/archive/2011/03/11/1981536.html 读读这篇文章
<script type="text/javascript">
/**
openLayer根据TMS加载谷歌地图瓦片
(1)先去下载加载谷歌地图瓦片,这样的软件有(水经注,google Map downloder,openLayersz中国官网提供的开源的软件)
(2)把下载的瓦片放到本地服务器上,最重要的是根据URL找到该瓦片
**/
var map, layer; //complex object of type OpenLayers.Map
function init() {
map = new OpenLayers.Map("map",
{
maxExtent: new OpenLayers.Bounds(-20037508.3427892,-20037508.3427892,20037508.3427892,20037508.3427892), //地图表示最大范围(左, 下, 右, 上) ,可以作为默认值
numZoomLevels:16, //地图缩放的最大级别(根据自己的实际需求设置)
maxResolution : 156543.0339, //地图缩最大像素,(默认)
units:'m', //地图单位米(默认)
projection: "EPSG:900913",//采用投影坐标系(默认)
displayProjection: new OpenLayers.Projection("EPSG:4326")//采用经纬度坐标系(默认)
}
);
layer = new OpenLayers.Layer.TMS("Name",
"http://127.0.0.1:9080/openLayers/", {
'type' : 'png',
'getURL' : get_my_url
});
map.addLayer(layer);
map.addControl(new OpenLayers.Control.Scale());
map.addControl(new OpenLayers.Control.MousePosition());
map.addControl(new OpenLayers.Control.LayerSwitcher());
//设置地图的显示的中间位置及缩放级别
var lonLat = new OpenLayers.LonLat(116.20101928710937,39.768436410838426); //下载瓦片的坐标
lonLat.transform(map.displayProjection, map.getProjectionObject()); //经纬度坐标和投影坐标的转换
map.setCenter(lonLat,10); //设置地图的显示的中间位置及缩放级别
}
function get_my_url(bounds) {
var res = this.map.getResolution();
var x = Math.round((bounds.left - this.maxExtent.left)
/ (res * this.tileSize.w));
var y = Math.round((this.maxExtent.top - bounds.top)
/ (res * this.tileSize.h));
var z = this.map.getZoom();
//本地服务器下瓦片的文件目录已经文件名(URL)
var path = "/openLayersTest/data/ol/bj/" + z + "/" + x +"/" + y+"." + this.type;
var url = this.url;
if (url instanceof Array) {
url = this.selectUrl(path, url);
}
return url + path;
}
</script>
相关文章推荐
- 网站高并发 大流量访问的处理及解决方法
- Nginx学习(1)
- DB2 日常维护技巧,第 4 部分
- linux 信号-- 安装
- Tomcat
- [linux]ubuntu 新建用户及相关问题
- web项目在tomcat上不能部署的解决方法
- linux学习 命令ll后字段的解释
- 三大Web服务器对比(3)
- 三大Web服务器对比(2)
- Linux下通用线程池的创建与使用
- hadoop HDFS 常用shell命令
- Intellij IDEA Tomcat 热部署(hot swap)
- linux mount命令学习
- NO.92 Linux nscd服务占内存巨大大无脑重启该服务解决
- arm内核学习
- Nginx优化(2)
- Nginx优化(1)
- 全面了解linux服务器的常用命令总结
- 将Openfire中的MUC改造成类似QQ群一样的永久群