ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Google layer improvements for maps with allOverlays set to true. r=tschaub (closes #2758)

Browse Source 
git-svn-id: http://svn.openlayers.org/trunk/openlayers@10550 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
ahocevar
2010-07-29 07:23:02 +00:00
parent ca27481c66
commit a5f2ddcfa1
4 changed files with 118 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
examples/google-v3-alloverlays.html Normal file
View File

@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html>
<head>
<title>OpenLayers Google (v3) Layer Example</title>
<link rel="stylesheet" href="../theme/default/style.css" type="text/css">
<link rel="stylesheet" href="../theme/default/google.css" type="text/css">
<link rel="stylesheet" href="style.css" type="text/css">
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="../lib/OpenLayers.js"></script>
<script src="google-v3-alloverlays.js"></script>
</head>
<body onload="init()">
<h1 id="title">Google (v3) allOverlays Layer Example</h1>
<p id="shortdesc">
Demonstrate use the Google Maps v3 API with allOverlays set to true on the map.
</p>
<div id="map" class="smallmap"></div>
<div id="docs">
<p>
You can also use Google layers as overlays, e.g. in a map with
allOverlays set to true. Note some of the layers disappear as
you zoom in to levels that are not supported by all layers. See the
<a href="google-v3-alloverlays.js" target="_blank">google-v3-alloverlays.js source</a>
to see how this is done.
</p>
</div>
</body>
</html>

35
examples/google-v3-alloverlays.js Normal file
View File

@@ -0,0 +1,35 @@
var map;
function init() {
map = new OpenLayers.Map('map', {allOverlays: true});
map.addControl(new OpenLayers.Control.LayerSwitcher());
// the SATELLITE layer has all 22 zoom level, so we add it first to
// become the internal base layer that determines the zoom levels of the
// map.
var gsat = new OpenLayers.Layer.Google(
"Google Satellite",
{type: google.maps.MapTypeId.SATELLITE, numZoomLevels: 22}
);
var gphy = new OpenLayers.Layer.Google(
"Google Physical",
{type: google.maps.MapTypeId.TERRAIN, visibility: false}
);
var gmap = new OpenLayers.Layer.Google(
"Google Streets", // the default
{numZoomLevels: 20, visibility: false}
);
var ghyb = new OpenLayers.Layer.Google(
"Google Hybrid",
{type: google.maps.MapTypeId.HYBRID, numZoomLevels: 22, visibility: false}
);
map.addLayers([gsat, gphy, gmap, ghyb]);
// Google.v3 uses EPSG:900913 as projection, so we have to
// transform our coordinates
map.setCenter(new OpenLayers.LonLat(10.2, 48.9).transform(
new OpenLayers.Projection("EPSG:4326"),
map.getProjectionObject()
), 5);
}

30
lib/OpenLayers/Layer/Google.js
View File

@@ -156,13 +156,41 @@ OpenLayers.Layer.Google = OpenLayers.Class(
* visible - {Boolean} Display the layer (if in range) * visible - {Boolean} Display the layer (if in range)
*/ */
setVisibility: function(visible) { setVisibility: function(visible) {
this.setGMapVisibility(visible);
// sharing a map container, opacity has to be set per layer // sharing a map container, opacity has to be set per layer
var opacity = this.opacity == null ? 1 : this.opacity; var opacity = this.opacity == null ? 1 : this.opacity;
OpenLayers.Layer.EventPane.prototype.setVisibility.apply(this, arguments); OpenLayers.Layer.EventPane.prototype.setVisibility.apply(this, arguments);
this.setOpacity(opacity); this.setOpacity(opacity);
}, },
/**
* APIMethod: display
* Hide or show the Layer
*
* Parameters:
* display - {Boolean}
*/
display: function(visible) {
if (!this._dragging) {
this.setGMapVisibility(visible);
}
OpenLayers.Layer.EventPane.prototype.display.apply(this, arguments);
},
/**
* Method: moveTo
*
* Parameters:
* bound - {<OpenLayers.Bounds>}
* zoomChanged - {Boolean} Tells when zoom has changed, as layers have to
* do some init work in that case.
* dragging - {Boolean}
*/
moveTo: function(bounds, zoomChanged, dragging) {
this._dragging = dragging;
OpenLayers.Layer.EventPane.prototype.moveTo.apply(this, arguments);
delete this._dragging;
},
/** /**
* APIMethod: setOpacity * APIMethod: setOpacity
* Sets the opacity for the entire layer (all images) * Sets the opacity for the entire layer (all images)

20
lib/OpenLayers/Layer/Google/v3.js
View File

@@ -181,11 +181,25 @@ OpenLayers.Layer.Google.v3 = {
* visible - {Boolean} Display the GMap elements. * visible - {Boolean} Display the GMap elements.
*/ */
setGMapVisibility: function(visible) { setGMapVisibility: function(visible) {
var type = this.type;
var layers = this.map.getLayersByClass("OpenLayers.Layer.Google");
var index = OpenLayers.Util.indexOf(layers, this);
var layer;
for (var i=layers.length-1; i>=0; --i) {
layer = layers[i];
if (layer.visibility === true && layer.inRange === true) {
type = layer.type;
visible = true;
break;
}
}
var cache = OpenLayers.Layer.Google.cache[this.map.id]; var cache = OpenLayers.Layer.Google.cache[this.map.id];
if (cache) { if (cache) {
var container = this.mapObject.getDiv(); var container = this.mapObject.getDiv();
if (visible === true) { if (visible === true) {
this.mapObject.setMapTypeId(this.type); this.mapObject.setMapTypeId(type);
container.style.left = ""; container.style.left = "";
if (cache.termsOfUse && cache.termsOfUse.style) { if (cache.termsOfUse && cache.termsOfUse.style) {
cache.termsOfUse.style.left = ""; cache.termsOfUse.style.left = "";
@@ -194,10 +208,7 @@ OpenLayers.Layer.Google.v3 = {
} }
cache.displayed = this.id; cache.displayed = this.id;
} else { } else {
if (cache.displayed === this.id) {
delete cache.displayed; delete cache.displayed;
}
if (!cache.displayed) {
container.style.left = "-9999px"; container.style.left = "-9999px";
if (cache.termsOfUse && cache.termsOfUse.style) { if (cache.termsOfUse && cache.termsOfUse.style) {
cache.termsOfUse.style.display = "none"; cache.termsOfUse.style.display = "none";
@@ -211,7 +222,6 @@ OpenLayers.Layer.Google.v3 = {
} }
} }
} }
}
}, },
/** /**