带有Sencha Touch 2.x的Google Place API v3

时间:2013-03-14 13:44:24

标签: google-maps sencha-touch-2 google-places-api sencha-architect

我是Sencha Touch的新手,知道Javascript,jQuery,HTML5。

我正在使用Sencha Touch + Sencha Architect开发简单的Google Map应用程序,它将标记放在当前位置,并使用Google Place在当前位置附近找到“商店”(即Google搜索所需的类型)。我在'callbackPlaces'中获取位置(即纬度,经度),但Google.Maps.Marker在'callbackPlaces'方法中出错(即通过'addMarker'方法调用,我也通过将Google.Maps.Marker放入'callbackPlaces')。

Ext.define('MyApp.view.Map', {
    extend: 'Ext.Map',
    alias: 'widget.map',

    config: {
        useCurrentLocation: true,
        listeners: [
            {
                fn: 'onMapMaprender',
                event: 'maprender'
            }
        ]
    },

    onMapMaprender: function(map, gmap, options) {
        this.initializePlaces();
    },

    initializePlaces: function() {

        //Set Marker on Current Position
        var geo = this.getGeo();
        var currentPosition = new google.maps.LatLng(geo.getLatitude(), geo.getLongitude());
        this.createMarker(currentPosition);

        //request set for Places Services
        var request = {
            location: currentPosition,
            radius: 500,
            types: ['store']
        };


        this.getMap().zoom = 15;

        // Call PlacesService
        var service = new google.maps.places.PlacesService(this.getMap());
        service.nearbySearch(request, this.callbackPlaces); 



    },

    callbackPlaces: function(results, status) {

        if (status == google.maps.places.PlacesServiceStatus.OK) {  

            for (var i = 0; i < results.length; i++) {
                addMarker(results[i]);
            }
        }
    },

    createMarker: function(position) {
        //Here Position = Google Map LatLng

        var infoWindow = new google.maps.InfoWindow();

        var marker = new google.maps.Marker({
            map: this.getMap(),
            position: position
        });

        google.maps.event.addListener(marker, "click", function() {    
            infoWindow.setContent("Lng: " + marker.position.lng() + "\n Lat: " + marker.position.lat());
            infoWindow.open(this.getMap(), marker);
        }); 
    },

    addMarker: function() {
        //Here Place = google.maps.places

        var infoWindow = new google.maps.InfoWindow();

        var marker = new google.maps.Marker({
            map: this.getMap(),
            position: place.geometry.location
        });


        google.maps.event.addListener(marker, "click", function() {    
            infoWindow.setContent("Lng: " + marker.position.lng() + "\n Lat: " + marker.position.lat());
            infoWindow.open(this.getMap(), marker);
        }); 
    }

});

我不知道出了什么问题!

任何帮助|提示都会受到赞赏!

提前致谢。

1 个答案:

答案 0 :(得分:1)

您指出callbackPlaces函数中存在范围问题。

因此,您应该替换以下行:

service.nearbySearch(request, this.callbackPlaces); 

service.nearbySearch(request, function (results, status) {
  this.callbackPlaces.call(this, [results, status]);
}); 

希望这有帮助