0

我在使用 ST2.3 时遇到问题。我已经从 2.1 升级，并且我有几个回归，现在工作正常。然而，似乎肯定被打破的一个问题是 Google api 周围的地图包装器。我的应用程序在测试和开发模式下运行良好，但一旦为生产而构建，地图就会停止工作。

它似乎中断的代码位于 setMapCenter 函数的 Map 代码中。

setMapCenter:function(e){var b=this,d=b.getMap(),a=b.getMapOptions(),c=(window.google||{}).maps;if(c){if(!e){if(d&&d.getCenter){e=d.getCenter()}else{if(a.hasOwnProperty("center")){e=a.center}else{e=new c.LatLng(37.381592,-122.135672)}}}

断点似乎就行了：new c.LatLng(37.381592,-122.135672).

为什么它会突然开始在生产构建上失败？

更新 这是堆栈跟踪，但由于代码被混淆/缩小，我无法找出问题所在：

Uncaught TypeError: undefined is not a function VM1471:1
Ext.define.setMapCenterVM1471:1
Ext.define.updateUseCurrentLocationVM1471:1
jVM1471:1
b.implement.initConfigVM1471:1

ETC...

奇怪的是，这使用 ST2.1 工作。它也适用于 ST2.3，但仅适用于测试/调试模式。最初显示视图时，我的代码甚至没有设置地图的中心：

这是地图视图：

Ext.define('MyApp.view.offices.OfficeMap', {
    extend: 'Ext.Panel',
    alias: 'widget.officemapview',

    requires: [
        'Ext.Map'
    ],

    config: {
        layout: 'fit',
        items: [
            {
                xtype: 'map',
                listeners: {
                    activate: function(me, newActiveItem, oldActiveItem, eOpts){
                        console.log("activate fired");

                    },

                    maprender: function () {
                        console.log("maprender fired");                     
                        var gMap = this.getMap();
                        this.fireEvent('googleMapRender', gMap);                        
                    }
                }
            }
        ],

        officeRecord: null
    }    
});

这是从视图接收渲染事件的控制器代码：

onGoogleMapRender: function (googleMap) {

    var record = this.selectedOffice;
    var longi = record.get("Longitude");
    var lati = record.get("Latitude");

    console.log("About to create google maps pos")        
    console.log("About to create google maps marker")
    var marker = new google.maps.Marker({
        position: new google.maps.LatLng(lati, longi)
    });
    console.log("About to set maps map object")
    marker.setMap(googleMap);

    setTimeout(function () {
        console.log("map setTimeout")
        // weird timeout issue? - http://stackoverflow.com/questions/15041697/sencha-touch-google-map-and-centering-a-marker                
        googleMap.setZoom(17);
        googleMap.panTo(pos);
    }, 500);

以下浏览器上的错误是：

Chrome - 未捕获的类型错误：未定义不是函数

IE - 对象不支持此功能

关于这里发生了什么的任何想法？

4

2 回答 2

0

那是因为您的 javascript 是在加载 google maps javascript 之前加载的。所以当 setMapCenter 拿到函数时，还没有 c （未定义）。你可以做的是使用一些回调，比如“painted”，然后设置你的“setMapCenter”。

更新

尝试这样做只是为了测试：

xtype: "map",
listeners: {
    activate: function(me, newActiveItem, oldActiveItem, eOpts){
        me.config.mapOptions = {
            center : new google.maps.LatLng(-42,-42),  // your center
            zoom : 14,
            //others options
        }
    },
    maprender: function(comp, map) {
        var me = this;
        var map = this.getMap();

        // marker test
        var position = new google.maps.LatLng(-42, -42);
        var marker = new google.maps.Marker({
            position: position,
            title : 'Hello World',
            map: map
        });
    }
}
于 2014-03-20T20:42:23.197 回答
0

也许在网络选项卡上的开发人员工具中检查 chrome 在生产模式和开发模式之间加载 javascript 文件有什么区别。

于 2014-03-20T20:36:24.517 回答