<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>测试使用xyz</title>
<link rel="stylesheet" href="js/theme/default/style.css" type="text/css">
<link rel="stylesheet" href="css/style.css" type="text/css">
<script src="js/map/OpenLayers.js" type="text/javascript"></script>
<script src="js/map/zh-CN.js" type="text/javascript"></script>
</head>
<script type="text/javascript">
var map, layer;
var proj = new OpenLayers.Projection("EPSG:4326");
var mapproj = new OpenLayers.Projection("EPSG:900913");
function init() {
//世界区域范围
var extentbak = new OpenLayers.Bounds(
-128 * 156543.0339, -128 * 156543.0339,
128 * 156543.0339, 128 * 156543.0339
);
//中国区域范围
var extent = new OpenLayers.Bounds(
66.978, 16.319,
154.852, 55.092
);
extent.transform(proj,mapproj); //投影转换
var ol_wms = new OpenLayers.Layer.WMS(
"中国区域矢量图",
"http://localhost:9009/geoserver/cite/wms",
{layers: "cite:bou2_4p", format: "image/png",isBaseLayer: false,visibility: false,transparent:true}
);
map = new OpenLayers.Map({
div: "map",
maxExtent: new OpenLayers.Bounds(
-128 * 156543.0339, -128 * 156543.0339,
128 * 156543.0339, 128 * 156543.0339
),
restrictedExtent: extent,
maxResolution: 611.496226171875*2*2*2*2*2*2*2, // corresponds to level 8 in the cache
controls: [],
//numZoomLevels: 3,
projection: new OpenLayers.Projection("EPSG:900913"),
// displayProjection: new OpenLayers.Projection("EPSG:4326"),
units: "m",
layers: [
new OpenLayers.Layer.XYZ(
"二维地图层",
"/google2/" ,
{zoomOffset: 1,'getURL':get_my_url} // since our map maxResolution differs from cache max resolution
),
new OpenLayers.Layer.XYZ(
"卫星地图层",
"/google2/" ,
{zoomOffset: 1,'getURL':get_my_url1})
]
});
map.addLayers([ol_wms]);
var markers = new OpenLayers.Layer.Markers("煤矿");
map.addLayer(markers);
//marker
var imgUrl = "http://localhost:9000/OpenLayersTest/images/iconSubStation.png";
var icon = new OpenLayers.Icon(imgUrl);
var marker = new OpenLayers.Marker(new OpenLayers.LonLat(9746760.76763,5443784.24274), icon);
markers.addMarker(marker);
var markers1 = new OpenLayers.Layer.Markers("煤矿二");
map.addLayer(markers1);
//marker
var imgUrl1 = "http://localhost:9000/OpenLayersTest/images/iconSubStation.png";
var icon1 = new OpenLayers.Icon(imgUrl);
var marker1 = new OpenLayers.Marker(new OpenLayers.LonLat(6746760.76763,5443784.24274), icon);
markers1.addMarker(marker1);
//map.addLayers([ol_wms]);
map.zoomToExtent(extent);
map.addControl(new OpenLayers.Control.PanZoomBar({
position: new OpenLayers.Pixel(6, 18)
}));
map.addControl(new OpenLayers.Control.Navigation());
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.addControl(new OpenLayers.Control.Scale($('scale'))); //比例尺
map.addControl(new OpenLayers.Control.MousePosition({element: $('location')})); //鼠标划过点的坐标
// map.addControl(new OpenLayers.Control.Permalink());
}
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()+this.zoomOffset;
var path = z +"/lx/Map_x=" + x + "y=" + y + "zoom=" + z + ".png";
var url = this.url;
if (url instanceof Array) {
url = this.selectUrl(path, url);
}
//alert(url+path);
return url + path;
}
function get_my_url1 (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()+this.zoomOffset;
var path = z +"/ter/Ter_x=" + x + "y=" + y + "zoom=" + z + ".png";
var url = this.url;
if (url instanceof Array) {
url = this.selectUrl(path, url);
}
//alert(url+path);
return url + path;
}
</script>
<body οnlοad="init()">
<div id="map" ></div>
</body>
</html>
pageEncoding="utf-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>测试使用xyz</title>
<link rel="stylesheet" href="js/theme/default/style.css" type="text/css">
<link rel="stylesheet" href="css/style.css" type="text/css">
<script src="js/map/OpenLayers.js" type="text/javascript"></script>
<script src="js/map/zh-CN.js" type="text/javascript"></script>
</head>
<script type="text/javascript">
var map, layer;
var proj = new OpenLayers.Projection("EPSG:4326");
var mapproj = new OpenLayers.Projection("EPSG:900913");
function init() {
//世界区域范围
var extentbak = new OpenLayers.Bounds(
-128 * 156543.0339, -128 * 156543.0339,
128 * 156543.0339, 128 * 156543.0339
);
//中国区域范围
var extent = new OpenLayers.Bounds(
66.978, 16.319,
154.852, 55.092
);
extent.transform(proj,mapproj); //投影转换
var ol_wms = new OpenLayers.Layer.WMS(
"中国区域矢量图",
"http://localhost:9009/geoserver/cite/wms",
{layers: "cite:bou2_4p", format: "image/png",isBaseLayer: false,visibility: false,transparent:true}
);
map = new OpenLayers.Map({
div: "map",
maxExtent: new OpenLayers.Bounds(
-128 * 156543.0339, -128 * 156543.0339,
128 * 156543.0339, 128 * 156543.0339
),
restrictedExtent: extent,
maxResolution: 611.496226171875*2*2*2*2*2*2*2, // corresponds to level 8 in the cache
controls: [],
//numZoomLevels: 3,
projection: new OpenLayers.Projection("EPSG:900913"),
// displayProjection: new OpenLayers.Projection("EPSG:4326"),
units: "m",
layers: [
new OpenLayers.Layer.XYZ(
"二维地图层",
"/google2/" ,
{zoomOffset: 1,'getURL':get_my_url} // since our map maxResolution differs from cache max resolution
),
new OpenLayers.Layer.XYZ(
"卫星地图层",
"/google2/" ,
{zoomOffset: 1,'getURL':get_my_url1})
]
});
map.addLayers([ol_wms]);
var markers = new OpenLayers.Layer.Markers("煤矿");
map.addLayer(markers);
//marker
var imgUrl = "http://localhost:9000/OpenLayersTest/images/iconSubStation.png";
var icon = new OpenLayers.Icon(imgUrl);
var marker = new OpenLayers.Marker(new OpenLayers.LonLat(9746760.76763,5443784.24274), icon);
markers.addMarker(marker);
var markers1 = new OpenLayers.Layer.Markers("煤矿二");
map.addLayer(markers1);
//marker
var imgUrl1 = "http://localhost:9000/OpenLayersTest/images/iconSubStation.png";
var icon1 = new OpenLayers.Icon(imgUrl);
var marker1 = new OpenLayers.Marker(new OpenLayers.LonLat(6746760.76763,5443784.24274), icon);
markers1.addMarker(marker1);
//map.addLayers([ol_wms]);
map.zoomToExtent(extent);
map.addControl(new OpenLayers.Control.PanZoomBar({
position: new OpenLayers.Pixel(6, 18)
}));
map.addControl(new OpenLayers.Control.Navigation());
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.addControl(new OpenLayers.Control.Scale($('scale'))); //比例尺
map.addControl(new OpenLayers.Control.MousePosition({element: $('location')})); //鼠标划过点的坐标
// map.addControl(new OpenLayers.Control.Permalink());
}
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()+this.zoomOffset;
var path = z +"/lx/Map_x=" + x + "y=" + y + "zoom=" + z + ".png";
var url = this.url;
if (url instanceof Array) {
url = this.selectUrl(path, url);
}
//alert(url+path);
return url + path;
}
function get_my_url1 (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()+this.zoomOffset;
var path = z +"/ter/Ter_x=" + x + "y=" + y + "zoom=" + z + ".png";
var url = this.url;
if (url instanceof Array) {
url = this.selectUrl(path, url);
}
//alert(url+path);
return url + path;
}
</script>
<body οnlοad="init()">
<div id="map" ></div>
</body>
</html>