Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

OpenLayers can parse GeoJSON in order to create an array of features. So, it is possible to create a layer from GeoJSON input by simply parsing it and then adding the features to a new vector layer.

So, my current solution sends an AJAX request with the current map extent as a parameter and when the server returns the GeoJSON data, it parses them, then clears the layer and puts the newly received features into the layer.

However, I wonder if OpenLayers can do this automatically. Is it possible to create a layer that requests new GeoJSON data after being moved (e.g. using the BBOX strategy), parses the data and then adds them to the layer? The same way it is done with WFS, for example.

I tried this code:

vectorLayer = new OpenLayers.Layer.Vector("Address points", {
    projection: MAP_PROJECTION,        
    strategies: [new OpenLayers.Strategy.BBOX()],
    protocol: new OpenLayers.Protocol.HTTP({
      url: "my-webserver-that-gets-map-extent-and-returns-GeoJSON-encoded-features",
      format: new OpenLayers.Format.GeoJSON(),
      callback: function() { alert('Did at least something happen?'); }
    })
});

Firebug shows that the AJAX request is really being sent every time when I move the map and the server really replies with the GeoJSON data. I used the OpenLayers GeoJSON parser to verify if those data form a correctly structured FeatureCollection, and they do.

However, the features do not appear on the map. I tried the OpenLayers.Control.DrawFeature to draw some points to the map manually and it works ok, so the layer is definitely added and set to visible. The callback function apparently isn't invoked at all (as there is no alert message).

Any hints as to what could be wrong, please?

share|improve this question
1  
If the URL of the JSON server is not on the same domain as your web app then browser security will block it. You'll need to set up a proxy. –  geographika Mar 30 '12 at 17:16
add comment

1 Answer

up vote 1 down vote accepted

I tested you code on my server and it works fine with my JSON file. So my suspicion is that it could be the format of your JSON file. Can you include it in your original question please?

OpenLayers.Format.GeoJSON's read operation takes in a type which is the format type of the JSON file. But since we're using the OpenLayers.Protocol.HTTP to call it, we don't have the option of supplying it, which means we need to provide the data in FeatureCollection format.

Try this format: (it's what i'm using and it's working)

{ "type": "FeatureCollection",
    "features": 
    [
        {"type":"Feature", "properties":{"species":"Cat"}, "geometry":{"type":"Polygon", "coordinates":[[[-86.484375, 33.3984375], [-86.484375, 23.5546875], [-86.484375, 12.3046875], [-78.046875, 7.3828125], [-69.609375, 6.6796875], [-64.6875, 8.7890625], [-60.46875, 16.5234375], [-60.46875, 22.1484375], [-60.46875, 28.4765625], [-60.46875, 36.2109375], [-62.578125, 46.7578125], [-69.609375, 31.2890625], [-72.421875, 34.1015625], [-73.125, 34.1015625], [-75.9375, 34.1015625], [-79.453125, 34.1015625], [-79.453125, 31.9921875], [-86.484375, 45.3515625], [-87.890625, 44.6484375], [-86.484375, 33.3984375]]]}}
        ,
        {"type":"Feature", "properties":{"species":"Alligator"}, "geometry":{"type":"Polygon", "coordinates":[[[-15.46875, 35.5078125], [21.09375, 29.8828125], [59.0625, 34.1015625], [73.125, 34.1015625], [94.921875, 32.6953125], [109.6875, 24.2578125], [111.796875, 10.1953125], [101.25, -0.3515625], [79.453125, 1.0546875], [78.75, 7.3828125], [98.4375, 8.7890625], [101.25, 14.4140625], [87.890625, 17.2265625], [69.609375, 13.0078125], [75.234375, 12.3046875], [75.234375, 10.8984375], [68.90625, 10.1953125], [68.203125, 13.0078125], [49.21875, 12.3046875], [49.921875, 8.0859375], [43.59375, 7.3828125], [42.890625, 13.0078125], [29.53125, 14.4140625], [-9.84375, -8.0859375], [-14.0625, -6.6796875], [21.796875, 17.2265625], [-28.828125, 35.5078125], [-15.46875, 35.5078125]]]}}
        ,
        {"type":"Feature", "properties":{"species":"Elephant"}, "geometry":{"type":"Polygon", "coordinates":[[[-137.109375, -12.3046875], [-144.140625, -1.7578125], [-162.421875, -2.4609375], [-168.75, -31.2890625], [-167.34375, -56.6015625], [-143.4375, -56.6015625], [-138.515625, -35.5078125], [-139.21875, -49.5703125], [-132.1875, -57.3046875], [-113.203125, -54.4921875], [-97.03125, -48.8671875], [-84.375, -38.3203125], [-80.859375, -21.4453125], [-80.859375, -10.1953125], [-86.484375, -10.1953125], [-89.296875, -22.1484375], [-97.734375, -32.6953125], [-116.015625, -39.7265625], [-121.640625, -35.5078125], [-134.296875, -17.2265625], [-132.890625, -11.6015625], [-137.109375, -12.3046875]]]}}
    ]
}
share|improve this answer
    
It works with the example you gave me and now it even works with my file. And I am not sure I even changed something in the file. So thank you for confirming I was doing it right :) –  Imp Apr 3 '12 at 14:39
    
I had the same problem, and I repaired my GeoJSON to Capt Dragon form i.e. in first line: { "type": "FeatureCollection", –  user2849950 Mar 30 at 18:41
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.