Сенча Touch - добавить маркеры на карту после Maprender - PullRequest
Новая
       19

Сенча Touch - добавить маркеры на карту после Maprender

6 голосов
/ 18 июля 2011

Я хочу загрузить маркеры на мою карту, в касании сенча, после того, как я загружу некоторые данные json из запроса ajax.Дело в том, что я не знаю, как этого добиться после запуска события maprender.У меня есть это:

мой вид карты: 

app.views.MapTab = Ext.extend(Ext.Panel, {
    iconCls: 'map',
    id: 'map',
    items: [{
        xtype: 'map',
        id: 'mapa',
        mapOptions : {
            center : new google.maps.LatLng(50.077721, 14.448585),
            zoom : 12,
            mapTypeId : google.maps.MapTypeId.ROADMAP,
            navigationControl: true,
            navigationControlOptions: {
                style: google.maps.NavigationControlStyle.DEFAULT
            }
        },
        listeners : {
            'maprender' : function(comp, map){
                Ext.dispatch({
                    controller: app.controllers.map,
                    action: 'map_rendered',
                    map: map
                });
            }
        }
    }],
    initComponent: function() {
        app.views.MapTab.superclass.initComponent.apply(this, arguments);
    }
});

сохранить для загрузки JSON: 

app.stores.results = new Ext.data.Store({
    model: "app.models.Results",
    proxy: {
        type: 'ajax',
        url: 'http://app.cz/json_list2.php?a=l&zp=1&u=vinohrady-praha&c0=500000&c1=6000000&p0=10&p1=120&cm20=1000&cm21=120000&pg=0&s=Datumu&t=byt&age=30&pod=0&lat=50.075401&lng=14.458344&pp=prodej&tp0=0&tp1=12',
        reader: {
            type: 'json',
            root: 'markers'
        }
    },
    listeners: {
        'load': function (t, r, s) {
            Ext.dispatch({
                controller: app.controllers.map,
                action: 'loaded',
                records: r
            });
        }
    }
});

контроллер 

app.controllers.map = new Ext.Controller({

    loaded: function(options) {
        for(var i = 0; i < options.records.length; i++){
            var marker = new google.maps.Marker({
                 position: new google.maps.LatLng(options.records[i].get('lat'), options.records[i].get('lng')),
                 map: app.views.mapTab.getComponent('mapa')
            });
        }
        // need to rerender/refresh the map here
    },

    map_rendered: function(options) {
        console.log("map rendered");
    }

});

1 Ответ

5 голосов
/ 18 июля 2011

Ваш код должен работать, но вы прикрепляете маркеры к компоненту Sencha Touch Map, а не к базовой карте Google Maps, доступ к которой можно получить с помощью свойства map. 

...
var marker = new google.maps.Marker({
    position: new google.maps.LatLng(options.records[i].get('lat'), options.records[i].get('lng')),
    **map: app.views.mapTab.getComponent('mapa').map**
});
...

Карта не должнане нужно повторно визуализировать вручную и нужно просто добавить их, когда вы связываете их с конфигурацией карты.

...