codesite-noreply at google.com
2009-Oct-03 16:30 UTC
[Mapstraction] [mapstraction] r38 committed - Fixed OpenLayers controls to work with Small/Large zoom and pan. Exten...
Revision: 38
Author: ajturner
Date: Sat Oct 3 09:29:49 2009
Log: Fixed OpenLayers controls to work with Small/Large zoom and pan.
Extended Google tile support for Map type or just base tiles option
http://code.google.com/p/mapstraction/source/detail?r=38
Modified:
/trunk/source/mxn.core.js
/trunk/source/mxn.google.core.js
/trunk/source/mxn.openlayers.core.js
/trunk/tests/index.htm
======================================--- /trunk/source/mxn.core.js Sun Sep 20
06:07:56 2009
+++ /trunk/source/mxn.core.js Sat Oct 3 09:29:49 2009
@@ -36,6 +36,7 @@
this.layers = [];
this.polylines = [];
this.images = [];
+ this.controls = [];
this.loaded = {};
this.onload = {};
this.element = element;
@@ -953,15 +954,16 @@
* should go in the URL.
*
* For example, the OpenStreetMap tiles are:
- * http://tile.openstreetmap.org/{Z}/{X}/{Y}.png
+ * m.addTileLayer("http://tile.openstreetmap.org/{Z}/{X}/{Y}.png",
1.0, "OSM", 1, 19, true);
*
* @param {tile_url} template url of the tiles.
* @param {opacity} opacity of the tile layer - 0 is transparent, 1 is
opaque. (default=0.6)
* @param {copyright_text} copyright text to use for the tile layer.
(default=Mapstraction)
* @param {min_zoom} Minimum (furtherest out) zoom level that tiles are
available (default=1)
* @param {max_zoom} Maximum (closest) zoom level that the tiles are
available (default=18)
+ * @param {map_type} Should the tile layer be a selectable map type in the
layers palette (default=true)
*/
-Mapstraction.prototype.addTileLayer = function(tile_url, opacity,
copyright_text, min_zoom, max_zoom) {
+Mapstraction.prototype.addTileLayer = function(tile_url, opacity,
copyright_text, min_zoom, max_zoom, map_type) {
if(!tile_url) {
return;
}
@@ -971,8 +973,9 @@
copyright_text = copyright_text || "Mapstraction";
min_zoom = min_zoom || 1;
max_zoom = max_zoom || 18;
-
- return this.invoker.go(''addTileLayer'', [ tile_url, opacity,
copyright_text, min_zoom, max_zoom ] );
+ map_type = map_type || true;
+
+ return this.invoker.go(''addTileLayer'', [ tile_url, opacity,
copyright_text, min_zoom, max_zoom, map_type] );
};
/**
======================================--- /trunk/source/mxn.google.core.js Sun
Sep 20 06:26:44 2009
+++ /trunk/source/mxn.google.core.js Sat Oct 3 09:29:49 2009
@@ -227,7 +227,7 @@
map.setMapType(G_HYBRID_MAP);
break;
default:
- map.setMapType(G_NORMAL_MAP);
+ map.setMapType(type || G_NORMAL_MAP);
}
},
@@ -299,12 +299,10 @@
});
},
- addTileLayer: function(tile_url, opacity, copyright_text, min_zoom,
max_zoom) {
-
+ addTileLayer: function(tile_url, opacity, copyright_text, min_zoom,
max_zoom, map_type) {
var copyright = new GCopyright(1, new GLatLngBounds(new
GLatLng(-90,-180), new GLatLng(90,180)), 0, "copyleft");
var copyrightCollection = new GCopyrightCollection(copyright_text);
copyrightCollection.addCopyright(copyright);
-
var tilelayers = [];
tilelayers[0] = new GTileLayer(copyrightCollection, min_zoom, max_zoom);
tilelayers[0].isPng = function() {
@@ -320,11 +318,16 @@
url = url.replace(/\{Y\}/g,a.y);
return url;
};
- tileLayerOverlay = new GTileLayerOverlay(tilelayers[0]);
-
+ if(map_type) {
+ var tileLayerOverlay = new GMapType(tilelayers, new
GMercatorProjection(19), copyright_text, {
+ errorMessage:"More "+copyright_text+" tiles
coming soon"
+ });
+ this.maps[this.api].addMapType(tileLayerOverlay);
+ } else {
+ tileLayerOverlay = new GTileLayerOverlay(tilelayers[0]);
+ this.maps[this.api].addOverlay(tileLayerOverlay);
+ }
this.tileLayers.push( [tile_url, tileLayerOverlay, true] );
- this.maps[this.api].addOverlay(tileLayerOverlay);
-
return tileLayerOverlay;
},
======================================--- /trunk/source/mxn.openlayers.core.js
Sat Oct 3 08:39:48 2009
+++ /trunk/source/mxn.openlayers.core.js Sat Oct 3 09:29:49 2009
@@ -106,19 +106,19 @@
map.controls[i-1].deactivate();
map.removeControl(map.controls[i-1]);
}
- // FIXME - can pan & zoom be separate?
- if ( args.pan ) {
- map.addControl(new OpenLayers.Control.PanZoomBar());
- }
- else { }
if ( args.zoom == ''large'' ) {
map.addControl(new OpenLayers.Control.PanZoomBar());
}
else if ( args.zoom == ''small'' ) {
- map.addControl(new OpenLayers.Control.ZoomBox());
+ map.addControl(new OpenLayers.Control.ZoomPanel());
+ if ( args.pan) {
+ map.addControl(new OpenLayers.Control.PanPanel());
+ }
}
else {
- map.addControl(new OpenLayers.Control.ZoomBox());
+ if ( args.pan){
+ map.addControl(new OpenLayers.Control.PanPanel());
+ }
}
if ( args.overview ) {
map.addControl(new OpenLayers.Control.OverviewMap());
======================================--- /trunk/tests/index.htm Sat Oct 3
08:39:48 2009
+++ /trunk/tests/index.htm Sat Oct 3 09:29:49 2009
@@ -32,14 +32,15 @@
//WhenDomReady(function(){
+ var m;
window.onload = function() {
var actionElm = document.getElementById(''actions'');
var infoElm = document.getElementById(''info'');
var eventsElm = document.getElementById(''events'');
- var m = new mxn.Mapstraction(''map'',
''google'');
-
+ m = new mxn.Mapstraction(''map'',
''google'');
+
m.endPan.addHandler(function(sEvtName, oEvtSource, oEvtArgs){
var center = oEvtSource.getCenter();
eventsElm.innerHTML += ''Map pan: ('' +
center.lat.toFixed(5) + '',''+
center.lon.toFixed(5) +'')<br/>'';
@@ -68,89 +69,109 @@
action: function(){
m.setCenterAndZoom(new mxn.LatLonPoint(37.4419, -122.1419), 10);
}
- },
- {
- desc: ''Pan map'',
- action: function(){
- m.setCenter(new mxn.LatLonPoint(37.3419, -122.0419), {pan: true});
- }
+ },
+ {
+ desc: ''Pan map'',
+ action: function(){
+ m.setCenter(new mxn.LatLonPoint(37.3419, -122.0419), {pan:
true});
+ }
},
{
- desc: ''Get info'',
- action: function(){
- infoElm.innerHTML = ''Info<br/>'';
- var bb = m.getBounds();
- infoElm.innerHTML += ''Bounds:<br/>SW('' +
bb.sw.lat.toFixed(5)
+ '',''+ bb.sw.lon.toFixed(5)
+'')<br/>NE('' + bb.ne.lat.toFixed(5) +
'',''+
bb.ne.lon.toFixed(5) +'')<br/>'';
- var ll = m.getCenter();
- infoElm.innerHTML += ''Center: ('' + ll.lat.toFixed(5)
+ '',''+
ll.lon.toFixed(5) +'')<br/>'';
- infoElm.innerHTML += ''Map type: '' + m.getMapType() +
''<br/>'';
- infoElm.innerHTML += ''Zoom: '' + m.getZoom() +
''<br/>'';
- }
+ desc: ''Get info'',
+ action: function(){
+ infoElm.innerHTML = ''Info<br/>'';
+ var bb = m.getBounds();
+ infoElm.innerHTML += ''Bounds:<br/>SW('' +
bb.sw.lat.toFixed(5)
+ '',''+ bb.sw.lon.toFixed(5)
+'')<br/>NE('' + bb.ne.lat.toFixed(5) +
'',''+
bb.ne.lon.toFixed(5) +'')<br/>'';
+ var ll = m.getCenter();
+ infoElm.innerHTML += ''Center: ('' +
ll.lat.toFixed(5) + '',''+
ll.lon.toFixed(5) +'')<br/>'';
+ infoElm.innerHTML += ''Map type: '' + m.getMapType()
+ ''<br/>'';
+ infoElm.innerHTML += ''Zoom: '' + m.getZoom() +
''<br/>'';
+ }
},
{
- desc: ''Set zoom'',
- action: function(){
- m.setZoom(8);
- }
+ desc: ''Set zoom'',
+ action: function(){
+ m.setZoom(8);
+ }
},
{
- desc: ''Add marker'',
- action: function(){
- var mkr = new mxn.Marker(new mxn.LatLonPoint(37.3419, -122.0419));
- mkr.setLabel(''Some random place'');
- mkr.setInfoBubble(''Some information about the random
place'');
- mkr.click.addHandler(markerEventHandler);
- mkr.openInfoBubble.addHandler(markerEventHandler);
- mkr.closeInfoBubble.addHandler(markerEventHandler);
- m.addMarker(mkr);
- }
+ desc: ''Add marker'',
+ action: function(){
+ var mkr = new mxn.Marker(new mxn.LatLonPoint(37.3419,
-122.0419));
+ mkr.setLabel(''Some random place'');
+ mkr.setInfoBubble(''Some information about the random
place'');
+ mkr.click.addHandler(markerEventHandler);
+ mkr.openInfoBubble.addHandler(markerEventHandler);
+ mkr.closeInfoBubble.addHandler(markerEventHandler);
+ m.addMarker(mkr);
+ }
},
{
- desc: ''Add marker offscreen'',
- action: function(){
- var mkr = new mxn.Marker(new mxn.LatLonPoint(37.3419, -117.0419));
- mkr.setLabel(''Some other place'');
- m.addMarker(mkr);
- }
+ desc: ''Add marker offscreen'',
+ action: function(){
+ var mkr = new mxn.Marker(new mxn.LatLonPoint(37.3419,
-117.0419));
+ mkr.setLabel(''Some other place'');
+ m.addMarker(mkr);
+ }
},
{
- desc: ''Auto center'',
- action: function(){
- m.autoCenterAndZoom();
- }
+ desc: ''Auto center'',
+ action: function(){
+ m.autoCenterAndZoom();
+ }
},
{
- desc: ''Add line'',
- action: function(){
- var pl = new mxn.Polyline([
- new mxn.LatLonPoint(37.3419, -122.0419),
- new mxn.LatLonPoint(36.3419, -120.0419),
- new mxn.LatLonPoint(38.3419, -119.0419),
- new mxn.LatLonPoint(37.3419, -117.0419)
- ]);
- pl.color = ''#00DD55'';
- m.addPolyline(pl);
- }
+ desc: ''Add line'',
+ action: function(){
+ var pl = new mxn.Polyline([
+ new mxn.LatLonPoint(37.3419, -122.0419),
+ new mxn.LatLonPoint(36.3419, -120.0419),
+ new mxn.LatLonPoint(38.3419, -119.0419),
+ new mxn.LatLonPoint(37.3419, -117.0419)
+ ]);
+ pl.color = ''#00DD55'';
+ m.addPolyline(pl);
+ }
+ },
+ {
+ desc: ''Add controls'',
+ action: function() {
+ m.addLargeControls();
+ m.addControls({
+ pan: true,
+ zoom: ''small'',
+ overview: true,
+ scale: true,
+ map_type: true,
+ });
+ }
},
- {
- desc: ''Swap API (yahoo)'',
- action: function(){
- m.swap(''map'', ''yahoo'');
- }
- },
- {
- desc: ''Swap API (microsoft)'',
- action: function(){
- m.swap(''map'', ''microsoft'');
- }
- },
- {
- desc: ''Swap API (openlayers)'',
- action: function(){
- m.swap(''map'', ''openlayers'');
- }
- },
-
+ {
+ desc: ''Add Base map type'',
+ action: function() {
+
m.addTileLayer("http://tile.openstreetmap.org/{Z}/{X}/{Y}.png",
1.0, "OSM", 1, 19, true);
+ // m.setMapType("OSM");
+ }
+ },
+ {
+ desc: ''Swap API (yahoo)'',
+ action: function(){
+ m.swap(''map'', ''yahoo'');
+ }
+ },
+ {
+ desc: ''Swap API (microsoft)'',
+ action: function(){
+ m.swap(''map'',
''microsoft'');
+ }
+ },
+ {
+ desc: ''Swap API (openlayers)'',
+ action: function(){
+ m.swap(''map'',
''openlayers'');
+ }
+ },
+
{ desc: ''Done.'', action: function(){} }
];