View Full Version : Events Wiring Up

11 Oct 2010, 3:48 AM
I've extended the KS sample and modified Map demo as per my requirements. I enclosed it inside a function to have toolbars and tab-bars over the map. It works perfectly. Now, I want to add markers whenever 'centerchange' event gets fired. However, I realized that I need it doesn't get fired. Do I need to do anything special over here?
The code is like:

var map = new Ext.Map({ getLocation: true });
map.addListener('centerchange', function (p1, p1, p2) {
//some code
alert('test if function executes');


11 Oct 2010, 3:53 AM
No, but when are you expect it to fire? It fires when the underlying "center_changed" event on the google map fires.

11 Oct 2010, 4:02 AM
Thanks for the instant reply Evan.
Well, when I load the map, first it shows some random location and then centers to my current and exact location. At this point, I need to show a marker. I used to use centerchange event, before modifying KS sample.
Please help.

11 Oct 2010, 4:15 AM
Again, that event is fired when the google map fires the center_changed event. Are you sure that's firing?

11 Oct 2010, 4:18 AM
Yes. The demo I built before extending KS, I can simply add listener to 'center_Change' event and in it, I can create object of marker and put it on map. However, In this case (extending KS sample), it doesn't get fired up. Do I need to do event bubble or something? I'm reading on it and think this what required.

11 Oct 2010, 4:21 AM
The code I used was:

map = new Ext.Map({ getLocation: true, centered: true, mapOptions: { zoom: 8} });
map.addListener('centerchange', function (currObject, mapObject, locationObject) {
var marker = new google.maps.Marker({
map: mapObject,
position: initialLocation

11 Oct 2010, 9:17 PM
Hi Evan,
I've written following code in KS sample. I want to know how I can add marker (or in which event) onto the map.

(function () {
alert('doint it');
var tb = new Ext.Toolbar({
ui: 'dark',
dock: 'bottom',
items: [{ xtype: 'button', text: 'Click Me', ui: 'action'}]
var map = new Ext.Map({ getLocation: true });

demos.Map = new Ext.Panel({
layout: 'fit',
items: [{
xtype: 'panel',
fullscreen: true,
dockedItems: [tb],
items: [map]