examples/window/gmap.js

   1 Ext.Loader.setConfig({enabled: true});
   2 Ext.Loader.setPath('Ext.ux', '../ux');
   3 Ext.require([
   4     'Ext.window.*',
   5     'Ext.ux.GMapPanel'
   6 ]);
   7
   8 Ext.onReady(function(){
   9     var mapwin;
  10
  11     Ext.get('show-btn').on('click', function() {
  12         // create the window on the first click and reuse on subsequent clicks
  13         if(!mapwin){
  14
  15             mapwin = Ext.create('Ext.Window', {
  16                 layout: 'fit',
  17                 title: 'GMap Window',
  18                 closeAction: 'hide',
  19                 width:450,
  20                 height:450,
  21                 border: false,
  22                 x: 40,
  23                 y: 60,
  24                 items: {
  25                     xtype: 'gmappanel',
  26                     zoomLevel: 14,
  27                     gmapType: 'map',
  28                     mapConfOpts: ['enableScrollWheelZoom','enableDoubleClickZoom','enableDragging'],
  29                     mapControls: ['GSmallMapControl','GMapTypeControl','NonExistantControl'],
  30                     setCenter: {
  31                         geoCodeAddr: '4 Yawkey Way, Boston, MA, 02215-3409, USA',
  32                         marker: {title: 'Fenway Park'}
  33                     },
  34                     markers: [{
  35                         lat: 42.339641,
  36                         lng: -71.094224,
  37                         marker: {title: 'Boston Museum of Fine Arts'},
  38                         listeners: {
  39                             click: function(e){
  40                                 Ext.Msg.alert({title: 'Its fine', text: 'and its art.'});
  41                             }
  42                         }
  43                     },{
  44                         lat: 42.339419,
  45                         lng: -71.09077,
  46                         marker: {title: 'Northeastern University'}
  47                     }]
  48                 }
  49             });
  50
  51         }
  52
  53         mapwin.show();
  54
  55     });
  56
  57  });