PDA

View Full Version : Sencha map with markers



newqreation
16 Jan 2012, 7:02 AM
I have been working around with the Ext.map recently. But i find i really difficult to use. It is very slow at loading (i can live with that part).

I want to add a marker to my map. I wan't to do this from lat and lng. I found a lot of examples on this forum, but none of them, have made it possible for me to put a marker on my map.

I would like to put the little blue marker which defines where i am. Like this:
30744

And then I would like to put the red markers for some stores around me.
How is it possible to get these different markers added to the following code:


ToolbarDemo.views.Mapcard = Ext.extend(Ext.Panel, {
dockedItems: [{
xtype: 'toolbar',
title: 'View contact',
ui: 'blue',
items: [
{
text: 'Tilbage',
ui: 'back',

}
]
}],

layout: 'card',
items: [{
xtype: 'map',
id: 'map',
useCurrentLocation: true,
mapOptions: {
zoom: 7,
mapTypeId : google.maps.MapTypeId.ROADMAP,
navigationControl: true,
navigationControlOptions: {
style: google.maps.NavigationControlStyle.DEFAULT
}
}
}],


updateWithRecord: function(record) {
Ext.each(this.items.items, function(item) {
item.update(record.data);
});
var toolbar = this.getDockedItems()[0];
toolbar.setTitle(record.get('shop_id'));
var mapToRefresh = Ext.getCmp('map');
var marker = new google.maps.Marker({
map: mapToRefresh.map,
position: new google.maps.LatLng(-25.363882,131.044922)
});
}
});
ToolbarDemo.views.Homecard.superclass.initComponent.apply(this, arguments);
Ext.reg('homecard', ToolbarDemo.views.Homecard);

I really hope someone can help me. I believe i have tried almost everyhing... :)

mitchellsimoens
16 Jan 2012, 8:29 AM
The markers are a google map feature so you would have to consult their docs and do it on the actual google map component that is under the ST Map component.

digeridoopoo
17 Jan 2012, 1:24 AM
Also check out Ext.Leaflet in the examples forum...it has some cool examples with markers.

:-)