Sencha touch 2 - 在地圖上顯示當前位置

我想顯示我的當前位置並獲取位置座標以在附近搜索。從下面的代碼開始顯示我在地圖上的位置，但它不起作用。Sencha touch 2 - 在地圖上顯示當前位置

{ 
    xtype: 'map', 
    useCurrentLocation: true 
}

來源

2011-11-20 Pravin

對於您必須指定緯度和Longitute值 –

我認爲這是ST2中的一個錯誤。我問（我認爲你做了:-)）這個問題也在Sencha論壇：http://www.sencha.com/forum/showthread.php?156501-Maps-with-sencha-touch

我在那個論壇的代碼沒有工作。我正在使用的代碼如下：

index.html文件看起來是這樣的：

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <title>Sample app</title> 

    <script type="text/javascript" src="lib/touch/sencha-touch-all-debug.js"></script> 
    <link href="lib/touch/resources/css/sencha-touch.css" rel="stylesheet" type="text/css" /> 
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script> 

    <script type="text/javascript"> 
     Ext.Loader.setConfig({ 
      enabled : true, 
      path : { 
       PPL : 'ppl.js' 
      } 
     }); 

     Ext.setup({ 
      tabletStartupScreen : 'tablet_startup.png', 
      phoneStartupScreen : 'phone_startup.png', 
      icon    : 'phone_startup.png', 
      onReady    : function() { 
       Ext.create('PPL.App', { 
        fullscreen : true 
       }); 
      } 
     }) 
    </script> 
</head> 
<body> 
</body> 
</html>

而且我ppl.js看起來是這樣的：

Ext.define('PPL.App', { 
    extend: 'Ext.Panel', 
    layout: 'vbox', 

    config: { 
     items: [{ 
      xtype: 'toolbar', 
      title: 'Sample MAP' 
     }, { 
      xtype: 'panel', 
      layout: 'fit', 
      items: [{ 
       xtype: 'map', 
       useCurrentLocation: true 
      }] 
     }] 
    } 
});

如果我改變我ppl.js寫入以下內容：

Ext.define('PPL.App', { 
    extend: 'Ext.Map', 
    layout: 'fit', 
    config: { 
     items: [{ 
      xtype: 'map', 
      useCurrentLocation: false 
     }] 
    } 
});

然後它正在工作！因此，我認爲我們需要等到下一個版本發佈，同時學習ST2 :-)

乾杯！

來源

2011-12-02 23:39:43 adis

您好，感謝您的答覆當前位置的代碼。我會試試這個.. – Pravin

我定義的自定義地圖類：

Ext.define("FindMyMoney.view.MapView", { 
    extend: "Ext.Map", 
    xtype: 'mapview', 
    config: { 
     useCurrentLocation: true, 
     listeners: { 
      maprender : function(comp, map){ 
       new google.maps.Marker({ 
        position: new google.maps.LatLng(this._geo.getLatitude(), this._geo.getLongitude()), 
        map: map 
       }); 
      } 
     } 
    } 
});

所以這會使我的當前位置的標記。簡單。

來源

2012-03-18 16:26:05

這是代碼。它會顯示多個標記與界限：

Ext.define("iME.view.Maps", { 
    extend: "Ext.Map", 
    xtype: 'mapview', 
    config: { 

     mapOptions: {  
      center: new google.maps.LatLng(28.80010128657071, 77.28747820854187), 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
      mapTypeControl: false 
     }, 

     listeners: { 
      maprender: function (comp, map) { 

       var markersll = [ 
        ['Noida', 28.80010128657071, 77.28747820854187], 
        ['Coogee Beach', 24.80010128565, 73.2874782084457], 
        ['Cronulla Beach', 25.80010128657071, 76.28747820854187], 
        ['Manly Beach', 28.80010128657071, 72.28747820854187], 
        ['Maroubra Beach', 9.052234, 75.243685] 
       ]; 

       var infowindow = new google.maps.InfoWindow(); 
       var marker, i, pos; 
       var bounds = new google.maps.LatLngBounds(); 
       for (i = 0; i < markersll.length; i++) { 

        pos = new google.maps.LatLng(markersll[i][1], markersll[i][2]); 
        bounds.extend(pos); 
        marker = new google.maps.Marker({ 

         position: pos, 
         animation: google.maps.Animation.BOUNCE, 
         icon: 'http://thumb10.shutterstock.com/thumb_small/429058/131292377/stock-vector-map-super-marker-icon-131292377.jpg', 
         map: map, 
         title: 'Click Me ' + i 
        });  

        google.maps.event.addListener(marker, 'click', (function (marker, i) { 
         return function() { 
          infowindow.setContent(markersll[i][0]); 
          infowindow.open(map, marker); 
         } 
        })(marker, i)); 
        map.fitBounds(bounds); 
       } 
      } 
     } 
    }  
});

來源

2013-04-24 12:53:32

好的例子...................................... ... – Gendaful

這裏是展示位置當前位置

var geo = Ext.create('Ext.util.Geolocation', { 
autoUpdate: false, 
listeners: { 
    locationupdate: function(geo) { 
    var currentLat = geo.getLatitude(); 
    var currentLng = geo.getLongitude(); 
    var altitude = geo.getAltitude(); 
    var speed = geo.getSpeed(); 
    var heading= geo.getHeading(); 
    }, 
    locationerror: function(geo, bTimeout, bPermissionDenied, bLocationUnavailable, message) { 
    if(bTimeout) 
     Ext.Msg.alert('Timeout occurred',"Could not get current position"); 
    else 
     alert('Error occurred.'); 
    } 
    } 
} 
}); 
geo.updateLocation();

來源

2014-06-14 09:07:20 Gaurav

Sencha touch 2 - 在地圖上顯示當前位置

回答

相關問題