1
votes

I have a sting that I get from a server and I need to loop through it. This string is actually a geojson of locations that I want to visualize in a map using openLayers. Here is an example of the returned string:

{crs:
    {"type":"name",
     "properties":{
            "name":"ESPG:4326"
      },
     },
     "features":[{"properties":{
                 "image":"IMAGE1"},
                 "type":"Feature",
                 "geometry":{
                           "type":"Point",
                           "coordinates":[0,0]
                  }},{"properties":{
                 "image":"IMAGE2"},
                 "type":"Feature",
                 "geometry":{
                           "type":"Point",
                           "coordinates":[10,10]
                  }},{"properties":{
                 "image":"IMAGE3"},
                 "type":"Feature",
                 "geometry":{
                           "type":"Point",
                           "coordinates":[75,99]
                  }}]
        ,type:"FeatureCollection"
}

As you can see each feature of features has some properties and a geometry. I would like to create a new layer (ol.layer.Vector), that for each element of the features will draw a point with the correspoinding coordinates and image. With the following code I'm managing to draw all the points in the map however with a predefined image. I guess I should loop through this string and get the coordinates and image and somehow create a layer (or many layers?) with those values as a source and style accordingly. Any ideas??Thanks!

//map is the actual map where the images load
//responseText is the String that I get from the server
//predefinedImage is actually a predefined image that I use as icon for the points.
//If I complitelly remove the "style" from geojson_layer it sets the image to a default value.
var geoJSONsource = new ol.source.Vector({
     features: (new ol.format.GeoJSON()).readFeatures(responseText)
});

geojson_layer = new ol.layer.Vector({
     source: geoJSONsource,
     style: predefinedImage
});

map.addLayer(geojson_layer);
1
How do you know which image to use?Jonatas Walker
The name IMAGE1 etc. represents some value which is appended to a link of a service ( java servlet ). So for instance, after i get somehow the value IMAGE1 I will have a string in javascript like so: var imageSource = 'http://localhost:8080/project/getImage?' + IMAGE1;user2983190

1 Answers

1
votes

This might help you:

https://gis.stackexchange.com/a/95389/77349

You should modify this line, though:

externalGraphic: 'marker.png',  

to something like

externalGraphic: this.image,  

hope this helps!