Sencha Touch 2 Sencha地图上的多个经度和纬度

我正在构建一个包含地址列表的应用程序。这个应用程序的工作方式是，一旦用户点击列表中的每个项目（地址），下一个页面将显示一张地图，而地图上会有一个标记，指向点击地址的确切位置。由于代码中所述的纬度和经度坐标，这成为可能。我的问题是我有多个地址，并且每个地址都有唯一的经度和纬度。我想让我的应用程序以这样的方式工作，即当用户点击他们感兴趣的任何地址时，应用程序将打开一个页面并显示地图和指向地图上地址确切位置的标记。我的代码如下：它工作正常，但当用户点击地址时，它会将它们置于相同的经度和纬度。Sencha Touch 2 Sencha地图上的多个经度和纬度

我的商店：

Ext.define('List.store.Presidents', { 
extend : 'Ext.data.Store', 

config : { 
    model : 'List.model.President', 
    sorters : 'lastName', 
    grouper : function(record) { 
     return record.get('lastName')[0]; 
    }, 

    data : [{ 

     firstName : "Ikhlas HQ", 
     lastName : "Tower 11A, Avenue 5, Bangsar South, No.8 Jalan Kerinchi 59200 Kuala Lumpur", 
     latitude : 3.110649, 
     longitude : 101.664991, 
     id: 'm12', 
    }, 
    { 
     firstName : "PEJABAT WILAYAH SELANGOR", 
     lastName : "No. 97, 97-1 & 97-2, Jalan Mahogani 5/KS7, Ambang Botanic, 41200 Klang, Selangor", 
     latitude : 3.003384, 
     longitude : 101.45256, 
     id: 'm1', 
    }, ] 

} 
});

我的控制器：

Ext.define('List.controller.Main', { 
extend: 'Ext.app.Controller', 

config: { 

    control: { 
     'presidentlist': { 
      disclose: 'showDetail' 
     }, 
    } 
}, 
showDetail: function(list, record) { 
      this.getMain().push({ 
       xtype: 'presidentdetail', 
       title: record.fullName(), 

listeners: { 
      maprender: function(comp, map) { 
       var position = new google.maps.LatLng(5.978132,116.072617); 
       var marker = new google.maps.Marker({ 
        position: position, 
        map: map 
         }); 
      google.maps.event.addListener(marker, 'click', function() { 
        infowindow.open(map, marker); 
         }); 
      setTimeout(function() { 
        map.panTo(position); 
       }, 1000); 

       }, 
      }, 
     }) 
    }, 
});

我的观点：

Ext.define('List.view.PresidentDetail', { 
extend : 'Ext.Map', 
xtype: 'presidentdetail', 

    config: { 
       title: 'Details', 
       styleHtmlContent: true, 
       scrollable: 'vertical', 
       //useCurrentLocation: true, 
       layout: 'fit', 

    mapOptions: { 
       zoom: 16, 
       mapTypeId: google.maps.MapTypeId.ROADMAP, 
       navigationControl: true, 
       navigationControlOptions: { 
       style: google.maps.NavigationControlStyle.DEFAULT 
       } 
      }, 
    } 


});

我的模型：

Ext.define('List.model.President', { 
extend : 'Ext.data.Model', 
config : { 
    fields : ['firstName', 'middleInitial', 'lastName', 'latitude', 'longitude'] 
}, 
fullName : function() { 
    var d = this.data, names = [d.firstName, (!d.middleInitial ? "" : d.middleInitial + "."), d.lastName]; 
    return names.join(" "); 
} 
});

请帮我解决。我需要列表中的每个地址都标有经度和纬度，这样当用户点击地址时，它会指向地图的确切位置。

来源

2012-06-04 Apulo Ohale Cosmas Lite

看看GitHub上的kentuni应用程序。它采用sencha touch v1并使用小册子，但它应该是一个很好的参考 - 它完全符合你想要的位置列表，当点击时用标记推动地图视图。

来源

2012-06-28 06:27:36 Digeridoopoo

感谢Digeridoopoo，我会检查出来，并将上传我的控制器给其他人参考。 –

在GitHub上搜索'unikent'。我认为它现在甚至可能在sencha touch 2中，我昨天下载了它来看看。它们将标记位置存储在.json文件中并调用它们。 – Digeridoopoo

Sencha Touch 2 Sencha地图上的多个经度和纬度

回答

相关问题