0

マーカー付きの地図があり、マーカーをクリックして基本的な情報を表示したいと考えています。

Sencha を初めて使用するので、リスト項目をクリックしたときと同じ効果を得るには、リスナー関数で何を実装すればよいかアドバイスが必要です。

たとえば、これは maprender 関数の私のコードです

var lat = 37.428607;
var lng = -122.169344;


var latLng = new google.maps.LatLng(lat, lng);


var marker = new google.maps.Marker({
    position: latLng,
    map: gmap,
    draggable: false,
    animation: google.maps.Animation.DROP,
    title: 'cool'
});


var contentString = 'bla bla bla';


var infowindow = new google.maps.InfoWindow({
    content: contentString
});


google.maps.event.addListener(marker, 'click', function() {
      /* here comes something that will make my detail list visible with the marker details*/
});

リストで使用する「itemtap」の関数と同じように機能させたい...次のようなもの:

onMyListItemTap: function(dataview, index, target, record, e, options) {
this.setActiveItem('detalji');this.down('#back').show();
this.down('#detalji').setData(record.data);
}
4

1 に答える 1

0

Github に Sencha Touch 1 の素晴らしい例があります...World Map と呼ばれるものだと思います。それを解凍すると (アプリは多くのフォルダーの 1 つにあります)、Google マップに複数のカスタム マーカーが表示されます。このプロジェクトは、カスタム マップ マーカーを表示するだけでなく、マーカー クリック時のポップアップ オーバーレイも表示するため、学習に非常に役立ちます。

まだ Sencha Touch 2 に適応させる必要がありますが、それほど難しくはないはずです...ここにいくつかのサンプルコードがあります (複数のマーカーが追加された後):

   google.maps.event.addListener(marker, 'click', function() 
                {
        if (!this.popup) 
                    {
          this.popup = new Ext.Panel(
                            {
            floating: true,
            modal: true,
            centered: true,
            width: 500,
            styleHtmlContent: true,
            scroll: 'vertical',
            items:[{
              xtype:'button', 
              ui:'round',
              text:'See Country Profile',
              handler:goToCountryWrapper,
              scope : this
            },
            (new countryOverlay(country)).overlayPanel
            ],
                layout: {
              type: 'auto',
              padding: '55',
              align: 'left'
            },
            dockedItems: [{
              dock: 'top',
              xtype: 'toolbar',
              title: country.title
              }],
          });
        };
        this.popup.show('pop');
      });

また、Sencha Touch 2 について私が理解していることから、マップ コントローラー (MyApp.map.controller ファイル) にリスナーを配置する必要があると思います... refs がマーカーを「見つける」ため、refs について読んでください( s) リスナーを定義し、アイテムに追加します。

進捗があれば、調査結果を投稿してください :-)

于 2012-05-12T20:55:23.567 に答える