Sencha touch - 无法谷歌地图标记答案

【问题标题】：Sencha touch - unable to google map markersSencha touch - 无法谷歌地图标记
【发布时间】：2012-02-02 21:16:56
【问题描述】：

我正在学习煎茶触摸并尝试在谷歌地图上放置标记。我已经在线查看了大多数示例，但我无法让标记和 infoWindow 工作。以下是我的代码：

myApp.views.MapCard = Ext.extend(Ext.Panel, {
    id: "mapcard",
    layout: 'card',
    initComponent: function() {
        this.map = new Ext.Map({
            useCurrentLocation: true,
            mapOptions: {
                zoom: 12,
            },
        });

        this.panel = new Ext.Panel({
            layout: 'fit',
            items: this.map,
        });

        this.items = this.panel;

        myApp.views.MapCard.superclass.initComponent.call(this);

        refresh = function(theMap) {
            var geoTag = {
                lat: '47.584863',
                longi: '-122.147026',
                text: 'Hello World',
            }
            addMarker(geoTag, theMap);
        }

        addMarker = function(geoTag, theMap) {
            var latLng = new google.maps.LatLng(geoTag.lat, geoTag.longi);
            var marker = new google.maps.Marker({
                map: theMap.map,
                position: latLng
            });

            google.maps.event.addListener(marker, "click", function() {
                geoTagBubble.setContent(tweet.text);
                geoTagBubble.open(theMap.map, marker);
            });
        };

        geoTagBubble = new google.maps.InfoWindow();

        refresh(this.map);
    },

});

Ext.reg('mapcard', myApp.views.MapCard);

我也无法获取用户的当前位置，我很确定在 initComponent 期间没有加载地图。我会调用一个 json 服务来拉取纬度/经度并稍后循环。如果有更好的实现，请告诉我！

非常感谢！

【问题讨论】：

标签： google-maps extjs sencha-touch

【解决方案1】：

这里有一个非常简单的示例应用程序来演示这一点： http://septa.mobi

您可以在 view-source 下或 GitHub 上找到源代码： https://github.com/mjumbewu/Septnuts/

这是将标记添加到地图的面板： https://github.com/mjumbewu/Septnuts/blob/master/src/Septnuts/MapPanel.js

警告：Sencha Touch 1.x 中有一个bug 阻止嵌入式 Google 地图接收任何点击事件

您需要在包含 sencha-touch.js 后包含此补丁，以便地图上的任何点击侦听器都能正常工作： https://github.com/mjumbewu/Septnuts/blob/master/src/sencha-maptouch-patch.js

【讨论】：