获取地理位置变量以放置在代理中

时间:2013-03-23 18:44:02

标签: extjs sencha-touch-2

我正在尝试将设备的当前位置添加到代理呼叫中。我已经使用'+ radius +'和'+ values +'添加了变量。我使用了Ext.util.Geolocation,可以在控制台中看到地理位置。我怎么得到一个lat和long变量,所以我可以添加到代理中,如'+ lat +'和'+ lon +'

Ext.define('FirstApp.controller.History', {
extend:'Ext.app.Controller',

config:{
    refs:{
        main:'main',
        placesContainer:'placesContainer',
        placesList:'placesContainer places list',
        info:'info',
        review:'review',
        rss:'rss',
        favourites:'favourites',
        mapcontainer:'mapcontainer',
        visit: '#visit',
        radius: '#radius'
    },
    control:{
        'placesContainer places list':{
            itemtap:'recordDetailsNavigation'
        },
        'main':{
            activeitemchange:'recordTabChanged'
        },
         '#home': {
            // On the tap event, call onNewTap
            tap: 'onHomeTap'
        },
          '#info': {
            // On the tap event, call onNewTap
            tap: 'onInfoTap'
        }
        ,
          '#search': {
            // On the tap event, call onNewTap
            tap: 'onSearchTap'
        }
          ,
          '#leaveReview': {
            // On the tap event, call onNewTap
            tap: 'onReviewTap'
        }

    },
    routes: {
        'placesContainer': 'gotoPlacesContainer',
        'placesContainer/:id': 'gotoPlacesContainerDetails',
        'info': 'gotoInfo',
        'review': 'gotoReview',
         'rss': 'gotoRss',
        'favourites': 'gotoFavourites',
        'mapcontainer': 'gotoMapContainer'
    }
     },
     recordDetailsNavigation:function (list, index, target, record) {
    console.log("recordDetailsNavigation");
    this.getApplication().getHistory().add(Ext.create('Ext.app.Action', {
        url:'placesContainer/' + record.get('id')
    }),true);
    },
    recordTabChanged:function(tab,value, oldValue){
    console.log("recordTabChanged "+value.xtype);
    this.getApplication().getHistory().add(Ext.create('Ext.app.Action', {
        url:value.xtype
    }),true);
     },


gotoPlacesContainer:function(){
    console.log('Goto PlacesContainer');
    this.getMain().setActiveItem(0);
    var items = this.getPlacesContainer().getItems();
    console.log("PlacesContainer has "+items.length+" children")
    if(items.length>1){
        this.getPlacesContainer().pop();
    }


},

gotoReview:function(){
    console.log('Goto Review');
    this.getMain().setActiveItem(1);
     Reviews.load();
},


gotoMapContainer:function(){
    console.log('Goto MapContainer');
    this.getMain().setActiveItem(2);
},

gotoPlacesContainerDetails:function(id){
    console.log('Goto PlacesContainer Details for id '+id);

    this.gotoPlacesContainer();
    this.getPlacesList().refresh();
    this.getPlacesList().on('refresh',function(){
        var store = Ext.getStore('Places');
        var index = store.find('id',id);
        var record = store.getAt(index)
        this.getPlacesContainer().push({
            xtype:'details',
            title:record.data.name,
            data:record.data
        })
        this.getApplication().getHistory().add(Ext.create('Ext.app.Action', {
            url:'placesContainer/' + record.get('id')
        }),true);
    },this);

},

  gotoInfo:function(){
    console.log('Goto Info');
    this.getMain().setActiveItem(3);
},

    gotoRss:function(){
    console.log('Goto Rss');
    this.getMain().setActiveItem(4);
},


gotoFavourites:function(){
    console.log('Goto Favourites');
    this.getMain().setActiveItem(5);
},


 onHomeTap: function() {

    Ext.Viewport.setActiveItem(Ext.create('FirstApp.view.Home'));
},

 onReviewTap: function() {

    Ext.Viewport.setActiveItem(Ext.create('FirstApp.view.CreateReview'));
},

  onInfoTap: function() {
    Ext.Viewport.setActiveItem(Ext.create('FirstApp.view.Info'));
},

  onSearchTap: function() {

    Ext.Viewport.setActiveItem(Ext.create('FirstApp.view.Main'));

    var values = this.getVisit().getValue();
     var radius = this.getRadius().getValue() * 1000;

    console.log(values);
    console.log(radius);

    var proxy = {
    type:'ajax',
    id:'myPlaceProxy',
    url:'https://maps.googleapis.com/maps/api/place/search/json?    location=52.247983,-7.141113&radius='+radius+'&types='+values+'&name=&sensor=false&key=',
    reader:{
        type:'json',
        rootProperty:'results'
    }
    }


   var geo = new Ext.util.Geolocation({
    autoUpdate: false,
    allowHighAccuracy: true,
    listeners: {
    locationupdate: function(geo) {
       lat = geo.getLatitude();
       lon = geo.getLongitude();
       var proxy = Ext.getCmp('myPlaceProxy');
       proxy.setUrl('https://maps.googleapis.com/maps/api/place/search/json?location='+lat+','+lon+'&radius='+radius+'&types='+values+'&name=&sensor=false&key=AIzaSyAAStZvDJ_5ENODEdSCanLWgJBG6p6eXBQ');
       console.log(proxy);
       Ext.StoreMgr.get('Places').setProxy(proxy);
       Ext.StoreMgr.get('Places').load();    
    }
    }
   });

  geo.updateLocation();
  }


});


Ext.define('FirstApp.store.Places',{
extend:'Ext.data.Store',

config:{

    autoLoad:false,
    model:'FirstApp.model.Place',
    proxy:{


    }
}
})

1 个答案:

答案 0 :(得分:0)

首先为您的代理提供ID,以便我们可以随时通过ID访问

var proxy = {
        type:'ajax',
        id:'myPlaceProxy',
        url:'https://maps.googleapis.com/maps/api/place/search/json?location=52.247983,-7.141113&radius='+radius+'&types='+values+'&name=&sensor=false&key=',
        reader:{
            type:'json',
            rootProperty:'results'
        }
    }

然后在你的geo location的locationupdate事件中访问代理

var geo = new Ext.util.Geolocation({
    autoUpdate: true,
    allowHighAccuracy: true,
    listeners: {
        locationupdate: function(geo) {
           lat = geo.getLatitude();
           lon = geo.getLongitude();
           var proxy = Ext.getCmp('myPlaceProxy');
           proxy.setUrl('https://maps.googleapis.com/maps/api/place/search/json?location='+lat+','+lon+'&radius='+radius+'&types='+values+'&name=&sensor=false&key='');
           console.log(proxy);
           Ext.StoreMgr.get('Places').setProxy(proxy);
           Ext.StoreMgr.get('Places').load();    
        }
    }
});

然后通过调用此

来触发geo的locationupdate事件
geo.updateLocation();

修改

但我强烈建议不要总是创建var geo 你只需要调用这个geo.updateLocation();一旦你在全球范围内创建它,就可以轻松地管理它

试试这个:

Ext.define('FirstApp.store.Places',{
extend:'Ext.data.Store',
id: 'myPlaces',
config:{

    autoLoad:false,
    model:'FirstApp.model.Place',
    proxy:{
        type:'ajax',
        url:'https://maps.googleapis.com/maps/api/place/search/json?    location=52.247983,-7.141113&radius='+radius+'&types='+values+'&name=&sensor=false&key=AIzaSyAAStZvDJ_5ENODEdSCanLWgJBG6p6eXBQ',
        reader:{
        type:'json',
        rootProperty:'results'
    }
}
});

之后,您可以将点击事件中的网址设置为

onSearchTap: function() {

    Ext.Viewport.setActiveItem(Ext.create('FirstApp.view.Main'));

    var values = this.getVisit().getValue();
     var radius = this.getRadius().getValue() * 1000;

    console.log(values);
    console.log(radius);    

   var geo = new Ext.util.Geolocation({
    autoUpdate: false,
    allowHighAccuracy: true,
    listeners: {
    locationupdate: function(geo) {
       lat = geo.getLatitude();
       lon = geo.getLongitude();
       Ext.StoreMgr.get('Places').getProxy().setUrl('https://maps.googleapis.com/maps/api/place/search/json?location='+lat+','+lon+'&radius='+radius+'&types='+values+'&name=&sensor=false&key='');
       Ext.StoreMgr.get('Places').load();    
    }
    }
   });

  geo.updateLocation();
  }