Google Markers Disappear after build

[jorik12345]

He Guys,

Having a weird issue here. I'm trying to build my app (production) for the use of a web app. I have added Google Markers on a map and everything works fine. In development mode. If I try to build my app for production the markers just disappear.

I thought that maybe some files aren't loaded from google but my map works fine. Does anyone have an idea how to fix this problem??

Production:
http://haarlem.jr-productions.nl

Development:
http://haarlem.jr-productions.nl/OLD

And the code of my Map.js file:

Ext.define('Haarlem.view.Map', {
    extend: 'Ext.NavigationView',
    xtype: 'getMap',
    
    config: {
        navigationBar: {
            items: [
                {
                  iconCls: 'search',
                  iconMask: true,
                  align: 'left'
                },
                {
                    xtype: 'button',
                    html: 'Lijst',
                    action: 'showlist',
                    ui: 'normal'
                },
                {
                    html: 'Kaart',
                    action: 'showmap'
                },
                {
                  iconCls: 'locate',
                  iconMask: true,
                  align: 'right'
                }
            ]
        },
        items: [
                {
                    xtype: 'map',
                    fullscreen: 'true',
                    layout: 'fit',
                    
                    isMap: true,
                    mapOptions:{
                        center : new google.maps.LatLng(52.38564386359783, 4.631771347045898),
                          clickable: true,
                          draggable: true,
                        zoom : 13,
                        mapTypeId : google.maps.MapTypeId.ROADMAP,
                        navigationControl: true,
                        navigationControlOptions: {
                            style: google.maps.NavigationControlStyle.DEFAULT
                        }        
                    },
                    listeners: [
                        {
                            fn: 'onMapRender',
                            event: 'maprender'
                        }
                    ],
                    
                    onMapRender: function(map, gmap){
                
                            var createBtn = Ext.create('Ext.Button', {
                                display: true,
                                html: '<table><tr><td rowspan="2"><img src="http://www.threehouse.nl/disgover/sites/default/files/image_phpxNsxtl.jpg" alt="" width="50" height="50" /></td><td><b style="font-size:13px;">Gedempte Oude Gracht 1</b></td></tr> <tr><td><span style="font-size:11px;">14 kantoor units - 30m2 per unit </td></tr></table>'
                            });
                
                            var panden = new Array();
                                panden.push({lat: 52.379409, lon: 4.633536, info: '<table style="line-height:15px;"><tr><td rowspan="3"><img src="http://www.threehouse.nl/disgover/sites/default/files/image_phpxNsxtl.jpg" alt="" width="50" height="50" /></td><td><b style="font-size:13px;">Gedempte Oude Gracht 1</b></td></tr> <tr><td><span style="font-size:11px;">14 kantoor units - 30m2 per unit </td></tr><tr><td><a style="font-size:11px; color:#7e1712" href="#">Klik hier voor meer info ></a></td></tr></table>' });
                                panden.push({lat: 52.377285, lon: 4.636545, info: '<table style="line-height:15px;"><tr><td rowspan="3"><img src="http://www.threehouse.nl/disgover/sites/default/files/oude_postkantoor_nieuwe_stadskantoor_haarlem.jpg" alt="" width="50" height="50" /></td><td><b style="font-size:13px;">Gedempte Oude Gracht 2</b></td></tr> <tr><td><span style="font-size:11px;">20 kantoor units - 10m2 per unit</td></tr><tr><td><a style="font-size:11px; color:#7e1712" href="#">Klik hier voor meer info ></a></td></tr></table>' });
                                panden.push({lat: 52.382536, lon: 4.637946, info: '<table style="line-height:15px;"><tr><td rowspan="3"><img src="http://www.threehouse.nl/disgover/sites/default/files/53374086.jpg" alt="" width="50" height="50" /></td><td><b style="font-size:13px;">Jansstraat 46</b></td></tr> <tr><td><span style="font-size:11px;">99 werkruimtes - 20m2 per werkruimte</td></tr><tr><td><a style="font-size:11px; color:#7e1712" href="#">Klik hier voor meer info ></a></td></tr></table>' });
                                panden.push({lat: 52.385302, lon: 4.623874, info: '<table style="line-height:15px;"><tr><td rowspan="3"><img src="http://www.threehouse.nl/disgover/sites/default/files/5718779073_e6ff82af49_z.jpg" alt="" width="50" height="50" /></td><td><b style="font-size:13px;">Zijlweg 120</b></td></tr> <tr><td><span style="font-size:11px;">Winkelpand - 200m2</td></tr><tr><td><a style="font-size:11px; color:#7e1712" href="#">Klik hier voor meer info ></a></td></tr></table>' });
                                panden.push({lat: 52.3823156, lon: 4.6294017, info: '<table style="line-height:15px;"><tr><td rowspan="3"><img src="http://www.threehouse.nl/disgover/sites/default/files/10483-500-408.jpg" alt="" width="50" height="50" /></td><td><b style="font-size:13px;">Gemeentehuis Haarlem</b></td></tr> <tr><td><span style="font-size:11px;">20 kantoor units - 10m2 per unit</td></tr><tr><td><a style="font-size:11px; color:#7e1712" href="#">Klik hier voor meer info ></a></td></tr></table>' });
                            
                            //var getLocation = Ext.getStore('pandenStore');
                            
                            //console.log(getLocation);
                            /*
                            getLocation.each(function(record, object) {
                                  panden.push({lat: record.get('lat'), lon: record.get('lng'), info: '<b>'+record.get('title') + '</b><br />' + record.get('indeling')}); 
                              });
                            */
                            for (var i = 0; i < panden.length; i++) {
                                        var position = new google.maps.LatLng(panden[i].lat, panden[i].lon)
                                item = new google.maps.Marker({
                                    position: position,
                                    map: gmap,
                                    draggable: false,
                                    animation: google.maps.Animation.DROP
                                });
                                
                                var infowindow = new google.maps.InfoWindow();
                                
                                google.maps.event.addListener(item, 'click', (function(item, i) {
                                       return function() {
                                         infowindow.setContent(panden[i].info);
                                         infowindow.open(map, item);
                                         gmap.setPosition(position);
                                       }
                                 })(item, i));
                                
                                google.maps.event.addListener(infowindow, 'closeclick', (function() {
                                    //alert('test');
                                })(infowindow, i));
                                 
                            }
                        }


            }
        ]
     }
}); 

Thanks.

[mitchellsimoens]

Any JS errors? Your use of listeners may not be suitable...

try

listeners : {
    maprender : function(map, gmap) {....}
}

[jorik12345]

Damn you are absolutely right. That was the solution. I'm going to remind that for the future!
Thanks!