加載器幾何點不會顯示

我是新來的openlayers和一個初學者的JavaScript，但我已經嘗試了3天晝夜。我的代碼似乎沒問題，但有一些我錯過了，只是無法弄清楚我有這個問題，我無法在我的地圖上找到我的幾何點。我的代碼都這樣： // HTML加載器幾何點不會顯示

<!doctype html> 
<head> 
    <title> Me OpenStreetMap </title> 
    <link rel="stylesheet" href="../assets/ol3/css/ol.css" type="text/css" /> 
    <link rel="stylesheet" href="../assets/ol3/css/samples.css" type="text/css" /> 
</head> 
<body> 

    <div id="map"></div> 
    <script src="../assets/ol3/js/ol.js"></script> 

    <script> 

// style for geometric layer 
var meStyle = new ol.style.Circle({ 
    radius: 20, 
    fill: new ol.style.Fill({ 
    color: '#ff9900', 
    opacity: 1 
    }), 
    stroke: new ol.style.Stroke({ 
    color: '#ffcc00', 
    opacity: 1 
    }) 
}); 
// geometric layer 
var geoLayer = new ol.layer.Vector({ 
source : new ol.source.Vector({ 
projection : 'EPSG:3857', 
url : '../data/json.json', 
format: new ol.format.GeoJSON(), 
style: meStyle 
}) 
}); 

     // create layer 
     var osmLayer = new ol.layer.Tile({ 
     source : new ol.source.OSM() 
     }); 


     // create view 
     var yaounde = new ol.proj.transform([11.5653, 3.86617], 
     'EPSG:4326', 'EPSG:3857' 
     ); 
     var view = new ol.View({ 
     center: yaounde, 
     zoom: 15 
     }); 

     // create map 
     var map = new ol.Map({ 
     target: 'map' 
     }); 

     map.addLayer(osmLayer, geoLayer); 
     map.setView(view); 
    </script> 

</body> 
</html>

// GeoJSON的

{"type":"FeatureCollection", 

    "features": 
    [ 
    {"type":"Feature","properties":{"Name":"","Description":""},"geometry":{"type":"Point","coordinates":[0.0,0.0]}}, 
    {"type":"Feature","properties":{"Name":"1","Description":""},"geometry":{"type":"Point","coordinates":[11.50728,3.87471,0.0]}}, 
    {"type":"Feature","properties":{"Name":"2","Description":""},"geometry":{"type":"Point","coordinates":[11.5072,3.8759,0.0]}}, 
    {"type":"Feature","properties":{"Name":"3","Description":""},"geometry":{"type":"Point","coordinates":[11.5032,3.87556,0.0]}}, 
    {"type":"Feature","properties":{"Name":"4","Description":""},"geometry":{"type":"Point","coordinates":[11.50291,3.87552,0.0]}}, 
    {"type":"Feature","properties":{"Name":"5","Description":""},"geometry":{"type":"Point","coordinates":[11.50278,3.87573,0.0]}}, 
    {"type":"Feature","properties":{"Name":"6","Description":""},"geometry":{"type":"Point","coordinates":[11.50316,3.87621,0.0]}}, 
    {"type":"Feature","properties":{"Name":"7","Description":""},"geometry":{"type":"Point","coordinates":[11.50347,3.87611,0.0]}}, 
    {"type":"Feature","properties":{"Name":"8","Description":""},"geometry":{"type":"Point","coordinates":[11.50314,3.8763,0.0]}}, 
    {"type":"Feature","properties":{"Name":"9","Description":""},"geometry":{"type":"Point","coordinates":[11.50325,3.87652,0.0]}}, 
    {"type":"Feature","properties":{"Name":"10","Description":""},"geometry":{"type":"Point","coordinates":[11.50356,3.87558,0.0]}}, 
    {"type":"Feature","properties":{"Name":"11","Description":""},"geometry":{"type":"Point","coordinates":[11.5033,3.87564,0.0]}}, 
    {"type":"Feature","properties":{"Name":"12","Description":""},"geometry":{"type":"Point","coordinates":[11.50397,3.87586,0.0]}}, 
    {"type":"Feature","properties":{"Name":"13","Description":""},"geometry":{"type":"Point","coordinates":[11.50299,3.87641,0.0]}}, 
    {"type":"Feature","properties":{"Name":"14","Description":""},"geometry":{"type":"Point","coordinates":[11.50279,3.8771,0.0]}}, 
    {"type":"Feature","properties":{"Name":"15","Description":""},"geometry":{"type":"Point","coordinates":[11.50269,3.87723,0.0]}}, 
    {"type":"Feature","properties":{"Name":"16","Description":""},"geometry":{"type":"Point","coordinates":[11.50258,3.87722,0.0]}}, 
    {"type":"Feature","properties":{"Name":"17","Description":""},"geometry":{"type":"Point","coordinates":[11.49122,3.8738,0.0]}}, 
    {"type":"Feature","properties":{"Name":"18","Description":""},"geometry":{"type":"Point","coordinates":[11.48567,3.87447,0.0]}}, 
    {"type":"Feature","properties":{"Name":"19","Description":""},"geometry":{"type":"Point","coordinates":[11.48548,3.88107,0.0]}}, 
    {"type":"Feature","properties":{"Name":"20","Description":""},"geometry":{"type":"Point","coordinates":[11.48526,3.8812,0.0]}}, 
    {"type":"Feature","properties":{"Name":"21","Description":""},"geometry":{"type":"Point","coordinates":[11.48614,3.88044,0.0]}}, 
    {"type":"Feature","properties":{"Name":"22","Description":""},"geometry":{"type":"Point","coordinates":[11.48638,3.88033,0.0]}}, 
    {"type":"Feature","properties":{"Name":"23","Description":""},"geometry":{"type":"Point","coordinates":[11.48641,3.88053,0.0]}}, 
    {"type":"Feature","properties":{"Name":"24","Description":""},"geometry":{"type":"Point","coordinates":[11.4868,3.88029,0.0]}}, 
    {"type":"Feature","properties":{"Name":"25","Description":""},"geometry":{"type":"Point","coordinates":[11.48772,3.87994,0.0]}}, 
    {"type":"Feature","properties":{"Name":"26","Description":""},"geometry":{"type":"Point","coordinates":[11.4887,3.88057,0.0]}}, 
    {"type":"Feature","properties":{"Name":"27","Description":""},"geometry":{"type":"Point","coordinates":[11.48869,3.88057,0.0]}}, 
    {"type":"Feature","properties":{"Name":"28","Description":""},"geometry":{"type":"Point","coordinates":[11.48868,3.8807,0.0]}}, 
    {"type":"Feature","properties":{"Name":"29","Description":""},"geometry":{"type":"Point","coordinates":[11.4888,3.88071,0.0]}}, 
    {"type":"Feature","properties":{"Name":"30","Description":""},"geometry":{"type":"Point","coordinates":[11.49206,3.8775,0.0]}}, 
    {"type":"Feature","properties":{"Name":"31","Description":""},"geometry":{"type":"Point","coordinates":[11.49251,3.87748,0.0]}}, 
    {"type":"Feature","properties":{"Name":"32","Description":""},"geometry":{"type":"Point","coordinates":[11.4923,3.87783,0.0]}}, 
    {"type":"Feature","properties":{"Name":"33","Description":""},"geometry":{"type":"Point","coordinates":[11.49273,3.87822,0.0]}} 
    ] 
}

的OpenStreet地圖出現由我找不到點

來源

2015-06-30 vncho

是解決很簡單：

map.addLayer(osmLayer); 
map.addLayer(geoLayer);

addLayer方法接受一個layer只有一個。 A working demo與您的代碼。

來源

2015-07-01 09:45:53

它正常工作。榮譽，我會繼續我的旅程...... – vncho

加載器幾何點不會顯示

回答

相關問題