在openlayers中添加彈出信息？

Question

我使用此代碼在地圖上加載kml文件，在本例中我使用OpenStreetMap。
我想知道如何在點擊kml（道路）時添加彈出窗口，以便顯示有關它的一些信息。

var line_1 = new OpenLayers.Layer.GML(
    'Line - 1', 
    "lines/line_1.kml",
    {
        visibility: true,
        format: OpenLayers.Format.KML,
        style: 
        {
            strokeWidth: 4, 
            strokeColor: "#ff0000", 
            strokeOpacity: 1
        },
        projection: map.displayProjection
    }
);

Answer 1

GML層實際上是用GML數據實例化的Vector層。 因此，您可以了解如何使用Vector圖層打開彈出窗口。 你的例子已經在做了。

他們使用Select Control並在選擇功能時打開彈出窗口：

selectControl = new OpenLayers.Control.SelectFeature(polygonLayer,
            {onSelect: onFeatureSelect, onUnselect: onFeatureUnselect});

在你的情況下， polygonLayer將是line_1 。

在onFeatureSelect上創建一個打開彈出窗口的方法：

        function onFeatureSelect(feature) {
        selectedFeature = feature;
        popup = new OpenLayers.Popup.FramedCloud("chicken", 
                                 feature.geometry.getBounds().getCenterLonLat(),
                                 null,
                                 "<div style='font-size:.8em'>Feature: " + feature.id +"<br>Area: " + feature.geometry.getArea()+"</div>",
                                 null, true, onPopupClose);
        feature.popup = popup;
        map.addPopup(popup);
    }

map是地圖對象。

試一試並評論您的進度或問題。