#1 Mon 07 January 2019 17:06
- Alain_75077
- Juste Inscrit !
- Date d'inscription: 29 Nov 2018
- Messages: 7
Problème d'affichage GEOjson sur une carte OpenLayers
Bonjour à tous,
Je veux afficher ma donnée en geojson sur ma carte OpenLayer mais mon geojson ne s'affiche pas et ma carte aussi. J'ai une api (en node.js) qui permets de récupérer la donnée qui est inscris dans ma base de donnée. J'ai un fichier script.js qui permets l'affichage de ma carte, récupérer la donnée envoyer par l'API et l'afficher sur la carte.
Dans script.js :
Je crée une source qui contiens le format de ma donnée :
Code:
var source = new VectorSource({ format: new GeoJSON(), features: [] });
Je crée un nouveau vectorLayer qui contiens le style du GEOjson :
Code:
var foncier2 = new VectorLayer({ source:source, style: function (feature, res) { property = feature.get("nature"); return new Style({ stroke: new Stroke({ color: [40, 40, 40, 1], width: 0.3 }), fill: new Fill({ color: couleur(property) }) }) }, });
Je requête sur mon API pour recevoir et traiter la donnée à l'aide d'une fonction callback :
Code:
function loadJSON(callback) { var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function () { if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) { console.log(this.responseText); callback(this.responseText); } }; xhr.open("GET", "adressIP:port/endpoint", true); // xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xhr.send(null);
Puis je crée une fonction qui transforme ma donnée en json puis en GEOjson:
Code:
var myData = JSON.parse(data); var geojsonObject = { "type": "FeatureCollection", "crs": { "type": "name", "properties": { "name": "EPSG:4326" }}, "features": [ { "type": "Feature", "geometry": { "type": "Polygon", "coordinates":myData[2].geom } } ]};
Pour finir j'affiche mon GEOjson sur la carte :
Code:
foncier2.getSource().clear(); foncier2.getSource().addFeatures(foncier2.getSource().getFormat().readFeatures(geojsonObject, { dataProjection: 'EPSG:4326', defaultFeatureProjection: 'EPSG:3857', })); foncier2.getSource().refresh(); foncier2.getSource().changed(); map.getView().fit(foncier2.getSource().getExtent());
Malheureusement ma carte ne s'affiche pas, je ne peux donc pas visualiser mon GEOjson. De plus, je n'ai aucune erreur dans ma console.
PS : Je travaille avec la version 5 d'OpenLayers
J'arrive à récupérer la donnée et à la visualiser à l'aide de ma console , elle ressemble à ceci : https://i.stack.imgur.com/8frt1.png
Hors ligne