Sencha Touch 2 Get Current Location on Button Click

Question

I have a toolbar button which when clicked should update my map to my current location. I am unable to find a working example of this functionality and hoping someone can advise me. Please see below for sample code - thanks for your help

Map:

Ext.define('MyApp.view.Myap', {
    extend: 'Ext.Map',
    alias: 'widget.mymap',
    config: {
        useCurrentLocation: false,
        mapOptions:{
            zoom: 9,
            center: new google.maps.LatLng(42.2, -72.5),
            mapTypeId: google.maps.MapTypeId.ROADMAP
        },
        listeners: {
            maprender : function(comp, map){
                google.maps.event.addListenerOnce(map, "idle", function () {
                    var host = window.location.origin ? window.location.origin : window.location.protocol + "/" + window.location.host;
                    var kmlOptions = {preserveViewport: false}
                    var now = +new Date();
                    var layer = new google.maps.KmlLayer(host + '/path/to.kml?timestamp=' + now, kmlOptions);
                    layer.setMap(map);
                    return layer;
                });  
            },
        }
    },
})

Toolbar Button:

Ext.define('MyApp.view.btnLocateMe', {
    extend: 'Ext.Button',
    alias: 'widget.btnlocateme',

    config: {
        ui: 'normal',
        iconCls: 'locate',
        iconMask: true,
        text: 'Locate Me',
        listeners: [
            {
                fn: 'onButtonTap',
                event: 'tap'
            }
        ]
    },

    onButtonTap: function(button, e, options) {
        //Produces error: cannot call method of undefined
        currentLocation: new google.maps.LatLng(this._geo.getLatitude(), this._geo.getLongitude());
        MyApp.view.MyMap.map.setCenter(currentLocation);
    }
});

score 0 · Answer 1 · edited May 23 '17 at 11:46

0

I have one suggestion.

Try changing current location to

new google.maps.LatLng( this.geo.getLatitude(),this.geo.getLongitude() ) ;

I think you can gather more info from this question in here.

edited May 23 '17 at 11:46

Community

1
1

answered Sep 18 '12 at 04:02

Rakesh Reddy

136
9

1

Where do you get this geo variable ? – Titouan de Bailleul Sep 18 '12 at 21:46

score 0 · Answer 2 · answered Sep 19 '12 at 02:44

my two cents contribution, try this

1) in MyApp.view.Myap substitute

    useCurrentLocation: false,

by

       useCurrentLocation : {
           autoUpdate : false
       },

Also you should declare currentLocation as a variable (I presume)

       var currentLocation = ...

This should works. I've use a similar logic as yours in onButtonTap but inside a controller with no problems

Best regards

score -2 · Answer 3 · answered Sep 18 '12 at 09:14

-2

The simplest way - switch to the another map view with option useCurrentLocation: true set in the config

answered Sep 18 '12 at 09:14

Valentin Kantor

1,799
1
23
27

the problem is "when clicked should update my map to my current location", switching to another view with param "useCurrentLocation" set to "true" solves the issue. – Valentin Kantor Sep 19 '12 at 19:47

Sencha Touch 2 Get Current Location on Button Click

3 Answers3