<html>
<head>
<title>Tiled ArcGIS MapServer</title>
<link rel="stylesheet" href="4.1.1/ol.css" type="text/css">
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script src="4.1.1/ol-debug.js"></script>
<script src="4.1.1/proj4.js"></script>
</head>
<body>
<div id="map" class="map"></div>
<script>
function getToken(){
var token;
$.ajax({
type:"POST",
url:"http://10.196.34.13/webForArcgis/getToken?state=1",
dataType:"json",
async:false,
success:function(data){
var objs=eval(data);
token=objs.message;
},
failer:function(){
token=null;
}
});
return token;
}
var token = getToken();
proj4.defs("EPSG:2435","+proj=tmerc +lat_0=0 +lon_0=114 +k=1 +x_0=500000 +y_0=0 +ellps=krass +towgs84=15.8,-154.4,-82.3,0,0,0,0 +units=m +no_defs");
var proj2435 = ol.proj.get('EPSG:2435');
proj2435.setExtent([6225.995788574219,-39409.70471191406,134588.05883789062,120019.99542236328]);
var newProj = ol.proj.get('EPSG:2435');
var newProjExtent = newProj.getExtent();
var attribution = new ol.Attribution({
html: 'XXXXXXXXXXXXXX'
});
var urlTemplate = 'http://10.194.148.18:6080/arcgis/rest/services/guangzhoumap_gz/MapServer/tile/{z}/{x}/{y}?token='+token;
//test1
var xyzLayer1 = new ol.layer.Tile({
extent: newProjExtent,
source: new ol.source.XYZ({
attributions: [attribution],
url: urlTemplate,
tilePixelRatio: 2,
minZoom: 0,
maxZoom: 10
})
})
//test2
var xyzLayer2 = new ol.layer.Tile({
source: new ol.source.XYZ({
attributions: [attribution],
maxZoom: 10,
minZoom:0,
extent: newProjExtent,
tileSize:[256,256],
wrapX: true,
tileUrlFunction: function(tileCoord) {
console.info(tileCoord);
var z = tileCoord[0];
var x = tileCoord[1];
var y = tileCoord[2];
var halfTileNum = Math.pow(2, z-1);
console.info(halfTileNum);
var arcgisOrigin_X = -5123300.0;
var arcgisOrigin_Y = 1.00023E7;
var url = urlTemplate.replace('{z}',z).replace('{x}',x).replace('{y}',y);
return url;
},
})
})
//test3 ok
var resolutions = [264.5838625010584,132.2919312505292,66.1459656252646,26.458386250105836,13.229193125052918,6.614596562526459,2.6458386250105836,1.3229193125052918,0.5291677250021167,0.26458386250105836,0.13229193125052918];
var maxZoom = 11;
var tilegrid = new ol.tilegrid.TileGrid({
origin: [-5123300.0,1.00023E7],
resolutions: resolutions
});
var source = new ol.source.TileImage({
projection:newProj,
tileGrid: tilegrid,
tileUrlFunction: function(tileCoord, pixelRatio, proj){
var z = tileCoord[0];
var x = tileCoord[1];
var y = tileCoord[2];
var arcX = -y;
var arcY = x ;
return urlTemplate.replace('{z}',z).replace('{x}',arcX).replace('{y}',arcY);;
}
});
var xyzLayer3 = new ol.layer.Tile({
source: source
});
var layers= [
xyzLayer3
];
var newView = new ol.View({
projection: newProj,
center: ol.extent.getCenter(newProjExtent),
zoom: 5,
});
var map = new ol.Map({
layers: layers,
target: 'map',
view: newView,
});
</script>
</body>
</html>
openlayers4.0+arcgis10.1+token
5星 · 超过95%的资源 需积分: 50 128 浏览量
2017-06-15
11:48:55
上传
评论
收藏 2KB RAR 举报 
demo.rar （2个子文件） 
demo 
ol4_arcgis10.1_xyz.html 3KB ol4_arcgis10.1_token3.html 2KB资源评论
guzicheng19902021-12-10两份文件 1：ol调用arcgis动态图层 2：ol调用arcgis发布切片。 有自定义坐标系和带token调用服务 有启发谢谢分享
