Sencha Touch 2：Google Maps Directions Route 不会显示

Posted 2023-02-25

【中文标题】Sencha Touch 2：Google Maps Directions Route 不会显示

【英文标题】：Sencha Touch 2: Google Maps Directions Route won't show

【发布时间】：2013-02-21 15:37:34

【问题描述】：

我正在使用视图在地图上显示一个位置，并在其下方使用一个小表单来获取用户地址（如果他们需要方向）。地图最初按照我的意愿呈现。有一个控制器可以处理点击按钮并使用路线更新显示。我可以看到它正在成功检索路线信息。它只是不更新​​显示来显示它。我错过了什么？

这是视图：

var tcmlatlng = new google.maps.LatLng(38.898748, -77.037684);
Ext.define('VisitTCMIndy.view.Directions',
extend: 'Ext.Panel',
requires: [
    'Ext.form.Panel',
    'Ext.Map'
],
config: 
    layout: 'vbox',
    items: [
        
            xtype: 'map',
            useCurrentLocation: false,
            flex: 3,
            mapOptions: 
                center: tcmlatlng,
                zoom: 15,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            ,
            listeners: 
                maprender: function(map,gmap,options)
                    var homemarker = new google.maps.Marker(
                        position: tcmlatlng,
                        map: gmap
                    );
                
            

        ,
        
            xtype: 'formpanel',
            id: 'directionsform',
            flex: 1,
            items:[
                
                    xtype: 'textfield',
                    name: 'address',
                    label: 'Address',
                ,
                
                    xtype: 'button',
                    ui:'action',
                    text: 'Get Directions'
                
            ]
        
    ]

);

这是控制器

Ext.define('VisitTCMIndy.controller.Directions',
extend: 'Ext.app.Controller',
config: 
    control: 
        dButton: 
            tap: 'loaddirections'
        
    ,
    refs: 
        dButton: '#directionsform button[ui=action]',
        tcmmap:'map',
        addfield:'textfield[name=address]'
    
,

loaddirections: function(dbutton)
    console.log('loaddirections');
    var gmap = this.getTcmmap();
    var directionsDisplay = new google.maps.DirectionsRenderer();
    var directionsService = new google.maps.DirectionsService();
    directionsDisplay.setMap(gmap.map);
    var tcmadd = "1600 Pennsylvania Ave, Washington, DC";
    var originadd = this.getAddfield().getValue();

    var request = 
        origin: originadd,
        destination: tcmadd,
        travelMode: google.maps.TravelMode.DRIVING
    ;

    directionsService.route(request, function(result, status)
        console.log(status);
        if(status = google.maps.DirectionsStatus.OK)
            console.log(result);
            directionsDisplay.setDirections(result);
        
    );

);

【参考方案1】：

我错误地引用了地图。我试图直接引用它而不是使用 getter。所以无论你在哪里看到“gmap.map”，它都应该是“gmap.getMap()”。