javascript - Google map 对 Sencha Touch 2 中的事件不敏感

Question

我在 Sencha touch 2 中定义了一个谷歌地图。它显示了 map ，但对触摸事件没有响应。我无法移动或捏它。

Ext.define('AddressBook.view.contact.Show', {
    extend: 'Ext.Panel',
    xtype: 'contact-show',
    requires: [
        'Ext.Map'
    ],
    config: {
        title: 'Information',
        layout: 'card',
        items: [
            {
                xtype: 'map',
                mapOptions : {
                    zoom : 15,
                    mapTypeId : google.maps.MapTypeId.ROADMAP,
                    navigationControl: true,
                    navigationControlOptions: {
                        style: google.maps.NavigationControlStyle.DEFAULT
                    }
                }
            }
        ]
    },

    centerMap: function(newRecord) {
        ...
    },

    setMarkers: function(markers) {
        ...
    }
});

我在 app.js 中创建了它:

Ext.Loader.setConfig({ enabled: true });

Ext.application({
    ...

    launch: function() {
        Ext.Viewport.add({
            xclass: 'AddressBook.view.contact.Show'
        });
    }
});

我包含了谷歌脚本:

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"</script>

问题是"Map" example Sencha 提供的似乎工作正常。但它使用 Ext.setup() 和 Ext.create() 在 app.js 中显示 map 。我不明白为什么它工作得很好。但我也不能使用这种方式来创建 map 。有谁知道问题出在哪里吗？

Answer 1

发现问题了。 来自 Sencha 的“ map ”示例包含一个脚本，该脚本不存在于示例中，但存在于我用作项目模板的另一个示例中。

<link rel="stylesheet" href="css/example.css" type="text/css"/>

由于这个不存在的脚本包括 GOOGLE map ，因此它可以在示例“ map ”中运行。

换句话说，如果您将其包含在带有 Google map 的项目中，它将变得无响应! 我不得不剥离“ map ”示例才能最终找到问题，这花费了我很多时间，感谢有人在它成为示例之前没有清理他的代码!

顺便说一句。这就是“navigationview”示例也有卡住的 Google map 的原因，因为它需要这个损坏的脚本来显示其样式。

我要求 Sencha 团队从他们的示例中删除这段令人困惑的代码。