1

GeoDjangoから返されたgeojsonからマップにフィーチャをプロットしました。これらの機能のリストを個別に表示したいと思います。クリックすると、地図はその特定のポイントに集中し、詳細を示すポップアップが表示されます。良い例はGoogleMapsです。ここでは、場所のリストがあり、それらのいずれかをクリックすると、その特定の場所に対応するマップにポップアップが表示されます。

この投稿は、eventListenerを作成する必要があることを示唆しているので、これを試しましたが、役に立ちませんでした:リンク

これらのコンポーネントをどのように結び付けるかわかりません。以下のコードは、リンクがクリックされると何もしません。hrefは、URLパターンのビューをチェックするため、混乱を招きます。そのため、これを回避するためにvoid(0)を挿入しました。

<div id="place-list"></div>
<div id="map"></div>

// ... code that reads a geoJSON and outputs features
var mapnik = new OpenLayers.Layer.OSM();
map.addLayer(vectorLayer);
vectorLayer.addFeatures(features);

// Build the clickable list of features
var list = "";
for (var i=0, len=features.length; i  len; i++) {
        // This does not work?
        list = list + "<a href=\"javascript:void(0);\""+"onclick=\"selectFeature("+i+");\">"+features[i].attributes["address"]+"</a><br/>";
}

    $("#place-list").append(list);  

    var info;
    function selectFeature(i) {
        feature = features[i];
        info = new OpenLayers.Control.SelectFeature(
            vectorLayer, 
            {
                eventListeners: {
                    getfeaturesinfo: function(event) {
                        map.addPopup(new OpenLayers.Popup.FramedCloud(
                            feature.id,
                            feature.lonlat,
                            null,
                            event.text,
                            null,
                            true
                        ));
                    }
                }
            }
        );

    }
    map.addControl(info);
    info.activate();
4

1 に答える 1

0

私は自分の問題を理解することができました。リンクを保持するOpenLayers.Control.Panelを作成し、それをマップに追加する必要がありました。機能オブジェクトごとに、イベントリスナーを作成し、そのIDを使用してそれぞれにリンクしました。

そして、これがその方法の素晴らしい例です:OpenLayers Eventhandlerの例

于 2012-05-15T04:02:27.093 に答える