15be7ff39b
git-svn-id: http://svn.openlayers.org/trunk/openlayers@12032 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
111 lines
5.0 KiB
HTML
111 lines
5.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>OpenLayers ArcGIS Cache Example (Autoconfigure with JSONP)</title>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
<link rel="stylesheet" href="../theme/default/style.css" type="text/css">
|
|
<link rel="stylesheet" href="style.css" type="text/css">
|
|
|
|
<script src="../lib/OpenLayers.js"></script>
|
|
<script src="../lib/OpenLayers/Layer/ArcGISCache.js" type="text/javascript"></script>
|
|
|
|
<!-- This is to simplify making the JSONP request for this example -->
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
|
|
|
|
<script type="text/javascript">
|
|
var map,
|
|
layerURL = "http://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer";
|
|
|
|
function init() {
|
|
var jsonp_url = layerURL + '?f=json&pretty=true&callback=?';
|
|
$.getJSON(jsonp_url, function(data) {
|
|
initMap(data);
|
|
});
|
|
}
|
|
|
|
function initMap(layerInfo){
|
|
/*
|
|
* The initialize function in this layer has the ability to automatically configure
|
|
* itself if given the JSON capabilities object from the ArcGIS map server.
|
|
* This hugely simplifies setting up a new layer, and switching basemaps when using this technique.
|
|
*
|
|
* see the 'initialize' function in ArcGISCache.js, or
|
|
* see the other two ArcGISCache.js examples for direct manual configuration options
|
|
*
|
|
*/
|
|
var baseLayer = new OpenLayers.Layer.ArcGISCache("AGSCache", layerURL, {
|
|
layerInfo: layerInfo
|
|
});
|
|
|
|
/*
|
|
* Make sure our baselayer and our map are synced up
|
|
*/
|
|
map = new OpenLayers.Map('map', {
|
|
maxExtent: baseLayer.maxExtent,
|
|
units: baseLayer.units,
|
|
resolutions: baseLayer.resolutions,
|
|
numZoomLevels: baseLayer.numZoomLevels,
|
|
tileSize: baseLayer.tileSize,
|
|
displayProjection: baseLayer.displayProjection,
|
|
StartBounds: baseLayer.initialExtent
|
|
});
|
|
map.addLayers([baseLayer]);
|
|
|
|
|
|
//overlay test layer
|
|
//http://openlayers.org/dev/examples/web-mercator.html
|
|
var wms = new OpenLayers.Layer.WMS("Highways",
|
|
"http://sampleserver1.arcgisonline.com/arcgis/services/Specialty/ESRI_StateCityHighway_USA/MapServer/WMSServer",
|
|
{layers: "2", format: "image/gif", transparent: "true"},
|
|
{ isBaseLayer: false, wrapDateLine: false }
|
|
);
|
|
map.addLayers([wms]);
|
|
|
|
|
|
|
|
map.addControl(new OpenLayers.Control.LayerSwitcher());
|
|
map.addControl(new OpenLayers.Control.MousePosition() );
|
|
//map.zoomToExtent(new OpenLayers.Bounds(-8341644, 4711236, -8339198, 4712459));
|
|
map.zoomToExtent(new OpenLayers.Bounds(-8725663.6225564, 4683718.6735907, -8099491.4868444, 4996804.7414467));
|
|
}
|
|
</script>
|
|
</head>
|
|
<body onload="init()">
|
|
<h1 id="title">OpenLayers ArcGIS Cache Example (Autoconfigure with JSONP)</h1>
|
|
|
|
<div id="tags">
|
|
arcgis, arcgiscache, cache, tms, jsonp
|
|
</div>
|
|
|
|
<p id="shortdesc">
|
|
Demonstrates the basic initialization of the ArcGIS Cache layer by using the server capabilities object.
|
|
</p>
|
|
|
|
<div id="map" class="smallmap"></div>
|
|
|
|
<div id="docs">
|
|
<p>This example demonstrates using the ArcGISCache layer for
|
|
accessing ESRI's ArcGIS Server (AGS) Map Cache tiles normally through
|
|
a live AGS MapServer. Toggle the visibility of the overlay to
|
|
demonstrate how the two layers are lined up correctly.</p>
|
|
|
|
<h2>Notes on this Layer</h2>
|
|
<p>
|
|
This method automatically configures the layer using the capabilities object
|
|
generated by the server itself. This page shows how to construct the url for the server capabilities object,
|
|
retrieve it using JSONP (and jQuery), and pass it in during construction. Note that in this case,
|
|
the layer is constructed before the map. This approach greatly simplifies the
|
|
configuration of your map, and works best when all your tiles / overlays are similarly laid out.
|
|
If you are using a live AGS map server for your layer, it can be helpful to check your
|
|
server configuration using this technique before trying one of the other examples for this layer.
|
|
</p>
|
|
|
|
<h2> Other Examples </h2>
|
|
<p>This is one of three examples for this layer. You can also configure this
|
|
layer to use <a href="arcgiscache_direct.html">prebuilt tiles in a file store (not a live server).</a>
|
|
As well a retrieve <a href="arcgiscache_ags.html">tiles from a live server.</a>
|
|
</p>
|
|
</div>
|
|
</body>
|
|
</html>
|