Openlayers 4.3.1が私のGeoJSONレイヤーを表示していません

Question

Openlayers 4.3.1でGeoJSONファイルからレイヤーを表示したいのですが、結果（vectorLayer変数）に空白ページが表示されます。私は何が欠けていますか？

にGeoJSONファイルはここにここにhttps://gist.githubusercontent.com/abdounasser202/5d830738ad29e6395743530545bd322b/raw/0c34d9a1ced1879432318b6860c1c21e8e88ef04/quartiers_yaounde.geojson

である私のJSコードが

ある

var styles = { 
    'Polygon': new ol.style.Style({ 
    stroke: new ol.style.Stroke({ 
     color: 'grey', 
     width: 1 
    }), 
    fill: new ol.style.Fill({ 
     color: 'rgba(0, 0, 255, 0.1)' 
    }) 
    }), 
    }; 

    var styleFunction = function(feature) { 
    return styles[feature.getGeometry().getType()]; 
    }; 

    var geojsonObject = 'https://gist.githubusercontent.com/abdounasser202/5d830738ad29e6395743530545bd322b/raw/0c34d9a1ced1879432318b6860c1c21e8e88ef04/quartiers_yaounde.geojson'; 
    console.log("geodata >>> ", geojsonObject); 

    var vectorSource = new ol.source.Vector({ 
     format: new ol.format.GeoJSON(), 
     url: geojsonObject 
    }); 

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

    var raster = new ol.layer.Tile({ 
    source: new ol.source.OSM() 
    }); 

    // var extent_degree = [11.4095, 3.71349, 11.5747, 3.9692]; 

    var map = new ol.Map({ 
    layers: [vectorLayer], 
    target: 'map', 
    view: new ol.View({ 
     // projection: 'EPSG:4326', 
     center: ol.proj.fromLonLat([11.5021, 3.8480]), 
     zoom: 6 
    }) 
    }); 

    // ol.proj.get('EPSG:4326').setExtent(extent_degree) 

    var units = map.getView().getProjection().getUnits(); 
    console.log("units >>> ", units); 

    var projections = map.getView().getProjection(); 
    console.log("projections >>> ", projections); 

Answer 1

あなたのコードを従えば、あなたはスタイリングポリゴン、ない他のジオメトリタイプです。したがって、マップ上にはポリゴンしか表示されません。他のジオメトリタイプは、スタイリングされていないため表示されません。 GeoJSONファイルにはポリゴンが含まれていないため、実際には何も表示されません。

私の知る限り、GeoJSONファイルにはマルチポリゴンしか含まれていません。それらを表示するには、変数スタイルで 'MultiPolygon'のスタイルを追加するか、コード内の文字列 'Polygon'を 'MultiPolygon'に変更します。