Tengo un archivo GeoJSON llamado mygeojson.json y quiero añadirlo como capa en OpenLayers 3 encima de una capa de openstreetmap. Hasta ahora he podido mostrar el mundo de openstreetmap, incluyendo el zoom, etc., pero por alguna razón no puedo poner el mygeojson.json en él.
El geojson contiene muchos polígonos y tiene el siguiente aspecto:
{
"type": "FeatureCollection",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "DN": 2 }, "geometry": { "type": "Polygon", "coordinates": [ [ [ 13.559093915055664, 52.545214330050563 ], [ 13.559633429050496, 52.545205649772548 ], [ 13.559633415380715, 52.545214636296755 ], [ 13.559093915055664, 52.545214330050563 ] ] ] } }
]
}mi main.html:
<!doctype html>
<html lang="en">
<head>
<link rel='stylesheet' href='http://ol3js.org/en/master/css/ol.css'>
<style>
#map {
height: 100%;
width: 100%;
}
</style>
<title>OpenLayers 3 example</title>
<script src="ol3/ol.js" type="text/javascript"></script>
</head>
<body>
<h1>My Map</h1>
<div id="map"></div>
<script type="text/javascript">
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
}),
new ol.layer.Vector({
title: 'added Layer',
source: new ol.source.GeoJSON({
projection : 'EPSG:4326',
url: 'mygeojson.json'
})
})
],
view: new ol.View({
center:[52.5243700 , 13.4105300],
zoom:2
})
});
</script>
</body>
</html>También he probado a quitar la información de la proyección pero no sirve de nada.
