1

I'm almost crazy with this. Why can this work:

    var featureStyle = new ol.style.Style({
        stroke: new ol.style.Stroke({
            color: 'green',
            width: 3
        })
    });

    var formatJSON = new ol.format.GeoJSON(); 

    var vectorSource = new ol.source.Vector({
        format: formatJSON,
        projection : 'EPSG:4326',
        url : 'testroute.json'
    });         

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

    map.addLayer( vectorLayer );

... and this don't:

    var featureStyle = new ol.style.Style({
        stroke: new ol.style.Stroke({
            color: 'green',
            width: 3
        })
    });

    var formatJSON = new ol.format.GeoJSON(); 

    var vectorSource = new ol.source.Vector({
        format: formatJSON,
        projection : 'EPSG:4326',
    });         

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

    var featuresText = "< SAME CONTENT OF 'testroute.json' FILE >";

    formatJSON.readFeatures( JSON.parse(featuresText) );

    map.addLayer( vectorLayer );

I have a GeoJSON file with some features. I can load it by using the url property of the ol.source.Vector but when I copy the file content to a local var (text string) and use the readFeatures method of ol.format.GeoJSON I can't see the layer in my map, but have no errors.

EDIT: GeoJSON content:

{"type": "FeatureCollection","features": [{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1884117,-22.9040017],[-43.1882999,-22.9041572]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1882999,-22.9041572],[-43.1882201,-22.9042775]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1882201,-22.9042775],[-43.187437,-22.9039915]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.187437,-22.9039915],[-43.186387,-22.9036587],[-43.1863246,-22.9036362],[-43.1841589,-22.9029368],[-43.1840747,-22.9029152],[-43.1839363,-22.9028715]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1839363,-22.9028715],[-43.1839048,-22.9029582],[-43.1838739,-22.9030212]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1838739,-22.9030212],[-43.1835967,-22.9035917],[-43.1835836,-22.9036224],[-43.1834168,-22.9040106],[-43.183227,-22.9044616],[-43.1831946,-22.9045387]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1831946,-22.9045387],[-43.1830637,-22.9048368],[-43.183043,-22.9048853],[-43.182868,-22.905319],[-43.1828424,-22.905381]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1828424,-22.905381],[-43.1826678,-22.9058102]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1826678,-22.9058102],[-43.1824398,-22.9062738],[-43.1824154,-22.9063163],[-43.1823666,-22.9063812],[-43.1823056,-22.9064313],[-43.1822596,-22.9064477],[-43.1821787,-22.9064753],[-43.182132,-22.9065105],[-43.1820915,-22.9065621],[-43.1819455,-22.9068425]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1819455,-22.9068425],[-43.1819226,-22.9068885],[-43.1818877,-22.9069415],[-43.1818345,-22.907027]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1818345,-22.907027],[-43.181911,-22.9070523],[-43.1821802,-22.9071415]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1821802,-22.9071415],[-43.1824451,-22.9072359]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1824451,-22.9072359],[-43.1831829,-22.9074864]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1831829,-22.9074864],[-43.1833739,-22.9075373],[-43.1834176,-22.9075501],[-43.1836451,-22.9076194]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1836451,-22.9076194],[-43.1839509,-22.9077043],[-43.1840108,-22.907721],[-43.184082,-22.9077407],[-43.1843233,-22.9078085]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1843233,-22.9078085],[-43.1850165,-22.9079971]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1850165,-22.9079971],[-43.1845198,-22.9091653],[-43.1844864,-22.9092494]]]}},{"type": "Feature","properties": {},"geometry":{"type":"MultiLineString","coordinates":[[[-43.1844864,-22.9092494],[-43.184054,-22.9102503],[-43.1840422,-22.910284],[-43.1840059,-22.910376]]]}}]}

EDIT 2: The part I've omitted:

for(x=0; x < routeData.length; x++ ) {
    var featureProperties = "{}";
    geojsonObject = geojsonObject + prefix + "{\"type\": \"Feature\",\"properties\": "+featureProperties+
        ",\"geometry\":" +JSON.stringify( routeData[x].geometry ) + "}";
    prefix = ",";
}
geojsonObject = geojsonObject + "]}";
  • 1
    Rio de Janeiro, right?. Because in var featuresText = "< SAME CONTENT OF 'testroute.json' FILE >" you have it in quotes? JSON should just be the curly braces. If you quote it, it becomes a string, not a Javascript Object. I once nearly went insane over a similar error. – John Powell Dec 16 '16 at 12:21
  • The string is just like you can see above. No quotes before the first curly brace (well, it came from an AJAX request). After all, I think the JSON.parse(featuresText) will make it an object. Yes, I'm carioca. – Magno C Dec 16 '16 at 12:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.