功能沒有顯示在地圖上

我一直在嘗試新版本（3）的Open Layers。我稍微修改了圖標特徵示例，因此它會顯示一個多邊形。我一直在尋找，閱讀並嘗試了幾個小時，但無法弄清楚我做錯了什麼。功能沒有顯示在地圖上

我不想使用geoJSON，因爲我想動態添加和刪除功能。

這是我到目前爲止的代碼：

<script type="text/javascript"> 
    var point1 = ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'); 
    var point2 = ol.proj.transform([35.41, 9.82], 'EPSG:4326', 'EPSG:3857'); 
    var point3 = ol.proj.transform([33.41, 11.82], 'EPSG:4326', 'EPSG:3857'); 
    var polyFeat = new ol.Feature({ 
    geometry: new ol.geom.Polygon([point1, point2, point3]) 
    }); 

    var polyStyle = new ol.style.Style({ 
    fill: new ol.style.Fill({ 
     color: 'blue' 
    }), 
    stroke: new ol.style.Stroke({ 
     color: 'red', 
     width: 2 
    }) 
    }); 

    polyFeat.setStyle(polyStyle); 

    var vectorSource = new ol.source.Vector({ 
    features: [polyFeat] 
    }); 

    var vectorLayer = new ol.layer.Vector({ 
    source: vectorSource 
    }); 

    var rasterLayer = new ol.layer.Tile({ 
    source: new ol.source.TileJSON({ 
     url: 'http://api.tiles.mapbox.com/v3/mapbox.geography-class.jsonp' 
    }) 
    }); 

    var map = new ol.Map({ 
    layers: [rasterLayer, vectorLayer], 
    target: document.getElementById('map'), 
    view: new ol.View({ 
     center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'), 
     zoom: 3 
    }) 
    }); 
</script>

爲什麼多邊形沒有顯示？爲您解決問題

來源

2014-10-30 GijsjanB

兩件小事：

首先，它建議關閉多邊形，所以用相同的座標作爲第一個聲明的第四點。

var point4 = ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857');

然後，您的幾何new ol.geom.Polygon([point1, point2, point3])應該new ol.geom.Polygon([[point1, point2, point3, point4]])

這裏重要的事實並非point4此外但你的陣列點轉變爲點的數組的數組。見the API，說OpenLayers 3 ol.geom.Polygon構造函數預計Array.<Array.<ol.Coordinate>>預期。

來源

2014-11-01 01:55:49

功能沒有顯示在地圖上

回答

相關問題