Question

I am using version 2 for Google Map. code is as below

var smallGoogleMap = new Ext.ux.GMapPanel({
xtype: 'gmappanel',
id : 'gSmallSiteMap',
width:'100%',
height:1000,
zoomLevel: 10,
gmapType: 'map',
mapConfOpts: ['enableScrollWheelZoom','enableDoubleClickZoom','enableDragging'],
mapControls: ['GSmallMapControl','GMapTypeControl','NonExistantControl'],
setCenter: {
  lat: latitude,
  lng: longitude,
  marker:{ title: newTitle}
}
});

If I use geoCodeAddr as shown below in setCenter than I am getting controls on resulted google map but with above code(lat/lng) I am loosing controls.

setCenter: {
  geoCodeAddr: newAdd,
  marker:{ title: newTitle}
}

Any idea to resolve the issue ?

Answer 1

Well after search on web I found that the source code GMapPanel.js has to modify to get the desirable result.

Original a piss of code which needs modification is as below

......
if (typeof this.addControl == 'object' && this.gmapType === 'map') {
        this.gmap.addControl(this.addControl);
    }

    if (typeof this.setCenter === 'object') {
        if (typeof this.setCenter.geoCodeAddr === 'string'){
            this.geoCodeLookup(this.setCenter.geoCodeAddr);
        }else{
            if (this.gmapType === 'map'){
                point = new GLatLng(this.setCenter.lat,this.setCenter.lng);
                this.gmap.setCenter(point, this.zoomLevel);    
            }
            if (typeof this.setCenter.marker === 'object' && typeof point === 'object'){
                this.addMarker(point,this.setCenter.marker,this.setCenter.marker.clear);
            }
        }
        if (this.gmapType === 'panorama'){
            this.gmap.setLocationAndPOV(new GLatLng(this.setCenter.lat,this.setCenter.lng), {yaw: this.yaw, pitch: this.pitch, zoom: this.zoom});
        }
    }
GEvent.bind(this.gmap, 'load', this, function(){
        this.onMapReady();
    });
},
onMapReady : function(){
    this.addMarkers(this.markers);
    this.addMapControls();
    this.addOptions();  
},
........

It has to modify as below

......
if (typeof this.addControl == 'object' && this.gmapType === 'map') {
        this.gmap.addControl(this.addControl);
    }

    GEvent.bind(this.gmap, 'load', this, function(){
        this.onMapReady();
    });

    if (typeof this.setCenter === 'object') {
        if (typeof this.setCenter.geoCodeAddr === 'string'){
            this.geoCodeLookup(this.setCenter.geoCodeAddr);
        }else{
            if (this.gmapType === 'map'){
                point = new GLatLng(this.setCenter.lat,this.setCenter.lng);
                this.gmap.setCenter(point, this.zoomLevel);    
            }
            if (typeof this.setCenter.marker === 'object' && typeof point === 'object'){
                this.addMarker(point,this.setCenter.marker,this.setCenter.marker.clear);
            }
        }
        if (this.gmapType === 'panorama'){
            this.gmap.setLocationAndPOV(new GLatLng(this.setCenter.lat,this.setCenter.lng), {yaw: this.yaw, pitch: this.pitch, zoom: this.zoom});
        }
    }

},
onMapReady : function(){
    this.addMarkers(this.markers);
    this.addMapControls();
    this.addOptions();  
},
........

We have to move “GEvent.bind” before setCenter is set to get controls on map.

GEvent.bind(this.gmap, 'load', this, function(){
    this.onMapReady();
});