Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #1
    Sencha User
    Join Date
    Apr 2011
    Posts
    212
    Vote Rating
    3
    bweiler is on a distinguished road

      0  

    Default B1 maprender event does not fire, but painted event does

    B1 maprender event does not fire, but painted event does


    The maprender event does not fire, but the painted event does.

    Doesn't work:
    Code:
    mapView.on({'maprender': function(view) {
    Works fine:
    Code:
    mapView.on({'painted': function(view) {

  2. #2
    Sencha User Jamie Avins's Avatar
    Join Date
    Mar 2007
    Location
    Redwood City, California
    Posts
    3,661
    Vote Rating
    20
    Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough

      0  

    Default


    Can we get the config used to replicate this issue?

    Sencha Inc

    Jamie Avins

    @jamieavins

  3. #3
    Sencha User
    Join Date
    Apr 2011
    Posts
    212
    Vote Rating
    3
    bweiler is on a distinguished road

      0  

    Default


    This was easy to reproduce in a smaller test app. However, I still had to cut out extra stuff, so hopefully this still works.

    When I use painted, it works. When I use maprender it doesn't fire.

    Code:
    Ext.Loader.setConfig({ 
        enabled: true 
    }); 
    
    
    Ext.application({
        name: 'Test',
        
        models: ['ContactModel'],
        stores: ['ContactListData'],
        views: ['Main', 'ContactList', 'Contact', 'Map'],
        controllers: ['ContactController'],
    
    
        launch: function() {
            console.log("Test application launched.");
        }
    });

    Code:
    Ext.define('Test.controller.ContactController', {
        extend: 'Ext.app.Controller',
        
        config: {
            
            // Setup the listeners
            control: {
                'contactlistview': {
                    painted: 'onRender'
                },
                'contactlistview list': {
                    itemtap: 'onItemTap'
                },
                'contactlistview #SettingsButton': {
                    tap: 'onSettings'
                }
            }
        },
        
        launch: function() {
            
            console.log('controller launch called');
            
            var main = Ext.create('Test.view.Main'),
                contacts = Ext.create('Test.view.ContactList'),
                mapview = this.buildMapView(),
                            Test.globals.application = this.getApplication();
            
            main.add(contacts);
            main.add(mapview);
            main.setActiveItem(mapview);
            
        },
            
        buildMapView: function() {
            
            var mapView = Ext.create('Test.view.Map', {flex: 1});
                //globals = Test.globals.mapGlobals;
            
            
            // Perform the map dependent initialization
            mapView.on({'maprender': function(view) {    
                    console.log("maprender event");
                }
            });
            
            return mapView;
        }
    });
    Code:
    Ext.define('Test.view.Map', {
        extend: 'Ext.Map',
        xtype: 'mapview',
        mixins: ['Ext.mixin.Observable'],
        //requires: ['Ext.mixin.Observable'],
        
        config: {
            layout: 'fit',
            //fullscreen: true,
            mapOptions: {
                disableDefaultUI: true,
                zoomControl: true,
                zoom: 10
            },
        },
        
        initialize: function() {
              this.enableBubble('location');
              this.enableBubble('geocode');
              this.enableBubble('popup');
        },
        getBubbleTarget: function() {
    
    
            var target = Test.globals.application;
    
    
                return target;
        }
    });

  4. #4
    Sencha User Jamie Avins's Avatar
    Join Date
    Mar 2007
    Location
    Redwood City, California
    Posts
    3,661
    Vote Rating
    20
    Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough

      0  

    Default


    The problem is you are trying to listen to the maprender event too late as maprender is done extremely early now to give people access to the map object as soon as possible. You should be able to just use mapView right after creation and have full access to it's API. If you still need to grab that event, you could do it the following way:

    Code:
            var mapView = Ext.create('Test.view.Map', {
                flex: 1,
                listeners: {
                    maprender: function() {
                        console.log("maprender event");
                    }
                }
            });
    Or you could extend the Map class and put the listener in initialize.

    Let me know if you need further assistance.

    Sencha Inc

    Jamie Avins

    @jamieavins

  5. #5
    Sencha User
    Join Date
    Feb 2011
    Posts
    7
    Vote Rating
    0
    kingkong22 is on a distinguished road

      0  

    Default


    I do have same problem but after dynamic create the map class, I found that it does not align center with the position that I've assigned on it. The marker will appear correctly but on top left and not the center part on the map.

  6. #6
    Sencha User cyberwombat's Avatar
    Join Date
    Oct 2011
    Posts
    237
    Vote Rating
    2
    cyberwombat is on a distinguished road

      0  

    Default


    I concur with original poster - maprender does not fire - my code is same as yours Jamie but in B1 it stopped working.

  7. #7
    Sencha User
    Join Date
    Nov 2011
    Posts
    20
    Vote Rating
    0
    John2011 is on a distinguished road

      0  

    Question Event not fired and map not centered

    Event not fired and map not centered


    I have the same problem. The "rendermap" event was no longer fired. I have replaced it with the "painted" event, however the map is not working properly.

    One of the issues I am having is that the map is no longer centered on the center. Instead it seems to go to the far lower-right corner of the position I have set.

    Also custom methods and variables attached to the map are no longer accessible, but I have been able to work around this by putting "config." in front of the method name.

    Code:
    MyApp.views.locationMap = Ext.create('Ext.Map', {
        id: 'locationMap',
        mapOptions: {
            center: MyApp.data.startPosition,
            zoom: MyApp.data.zoomLevel,
            disableDefaultUI: true,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        },
        positionIcon: null,
        infoBubble: null,
        markers: [],
        listeners: {
            painted: function(thisMap, map) {
                console.log('rendering map');
                console.log(MyApp.data.startPosition);
                thisMap.config.setPosition();
            }
        },
        setPosition: function() {
        },
        clearMarkers: function() {
        }
    });

  8. #8
    Sencha User
    Join Date
    Apr 2011
    Posts
    212
    Vote Rating
    3
    bweiler is on a distinguished road

      0  

    Default


    Here's a workaround for centering the map:
    Code:
    // Perform the map dependent initialization
    mapView.on({'painted': function(view) {
      ...  
      // Mark the user's location
      if (globals.location) {
         view.addMarker(globals.location);
         view.setMapCenter(globals.location);
      }
      ...

  9. #9
    Sencha User
    Join Date
    Apr 2011
    Posts
    212
    Vote Rating
    3
    bweiler is on a distinguished road

      0  

    Default


    [In reply to Jamie's post above]

    This makes sense. The only way to capture the maprender event is to put the listener in the map configuration.

    This should probably be clarified in the documentation for the maprender event.

    Thanks