Sencha Touch: невозможно добавить маркер на карту. Пожалуйста помоги? - PullRequest
Новая
       26

Sencha Touch: невозможно добавить маркер на карту. Пожалуйста помоги?

0 голосов
/ 02 августа 2011

Я прекрасно провожу время, изучая Sencha Touch, но мне кажется, что кое-что должно быть проще или глючит.Сейчас я пытаюсь сделать добавить маркер для отображения текущего местоположения на карте .

У меня есть видовой экран с верхней панелью инструментов и TabPanel с картой наПервая карта (вкладка) и я могу получить текущее местоположение без проблем.У меня проблема с созданием маркера, указывающего, где я нахожусь.

Я пытался прослушивать события как на карте, так и в ее родительском контейнере, но все еще не могу заставить его работать.Может быть, это проблема масштаба ?!Любая помощь будет высоко ценится ...

КОД: 

Ext.setup({
...
onReady: function() {

    var TopBar, Tabs, MapHome, Viewport, Homecard;

    /* 
     *      HOME
     */

    MapHome = new Ext.Map({
        title: 'Map',
        useCurrentLocation: true
    });


    Homecard = new Ext.Panel({
        title: "home",
        iconCls: "home",
        items: [MapHome],
        listeners: {
            activate: function() {
                var marker = new google.maps.Marker({
                    position: MapHome.map.center,
                    title : 'testing',
                    map: MapHome.map
                });
            }
        }
    });

    /*
     *      MAIN
     */

    TopBar = new Ext.Toolbar({
        dock: 'top',
        xtype: "toolbar",
        title: "<img class='titleLogo' src='css/images/logo.png' />",
        items: [

            { xtype: 'spacer' },
            {
                iconCls: 'settings9',
                iconMask: true,
                text: 'options'
            }
        ]
    });

    Tabs = new Ext.TabPanel({
        id: 'tabs',
        //fullscreen:true,
        dock: 'bottom',
        flex: 1,
        tabBar: {
            dock: 'bottom',
            layout: {
                pack: 'center'
            }
        },
        items: [ Homecard]
    });

    Viewport = new Ext.Panel({
        fullscreen:true,
        layout:{type:'vbox',align: 'stretch'},
        useLoadMask:true,
        ui:'dark',
        items: [TopBar,Tabs],
    });
  }
});

Ответы [ 2 ]

2 голосов
/ 03 августа 2011

Прослушиватель событий для centerchange был лучшим решением, которое я нашел. И поскольку моя карта вообще не взаимодействует, мне кажется, это работает.

Вот код: 

Ext.setup({
fullscreen: true,
tabletStartupScreen: 'splash.png',
phoneStartupScreen: 'splash.png',
icon: 'icon.png',
glossOnIcon: true,
onReady: function() {

var refreshMap = function(themap){
// It should clear all markers first, but that is not important right now since the map has all interaction disabled
    var marker = new google.maps.Marker({
        position: themap.center,
        title : 'testing',
        map: themap
    });
}


    var TopBar, Tabs, MapHome, Viewport, Homecard;

    /* 
     *         HOME
     */

    MapHome = new Ext.Map({
        title: 'Map',
        useCurrentLocation: true,
        listeners: {
            centerchange : function(comp, map){
                refreshMap(map);
            }
       },
        mapOptions : {
            mapTypeControl : false,
            navigationControl : false,
            streetViewControl : false,
            backgroundColor: 'transparent',
            disableDoubleClickZoom: true,
            zoom: 17,
            draggable: false,
            keyboardShortcuts: false,
            scrollwheel: false,
            mapTypeId: google.maps.MapTypeId.HYBRID
       }
    });



    Homecard = new Ext.Panel({
        title: "home",
        iconCls: "home",
        items: [MapHome]
    });

    /*
     *         MAIN
     */

    TopBar = new Ext.Toolbar({
        dock: 'top',
        xtype: "toolbar",
        title: "<img class='titleLogo' src='css/images/logo.png' />",
        items: [

            { xtype: 'spacer' },
            {
                iconCls: 'settings9',
                iconMask: true,
                text: 'options'
            }
        ]
    });

    Tabs = new Ext.TabPanel({
        id: 'tabs',
        //fullscreen:true,
        dock: 'bottom',
        flex: 1,
        tabBar: {
            dock: 'bottom',
            layout: {
                pack: 'center'
            }
        },
        items: [ Homecard, Nearbycard, Waypointscard, Shopcard, Searchcard]
    });


    Viewport = new Ext.Panel({
        fullscreen:true,
        layout:{type:'vbox',align: 'stretch'},
        useLoadMask:true,
        ui:'dark',
        items: [TopBar,Tabs],
    });
  }
});
0 голосов
/ 03 августа 2011

Похоже, что ваше activate событие будет вызвано до того, как ваша карта сможет отобразиться на экране и подготовиться. Попробуйте вызвать код маркера с помощью события maprender, которое запускается компонентом Map.

...