2

I'm trying to add vector layer to my map from a GeoJSON file stored in the same directory as my maps index.html. However, it won't work.

Is there something wrong with my syntax?

My code:

<!doctype html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="http://openlayers.org/en/v3.0.0/css/ol.css" type="text/css">
    <style>
      .map {
        height: 600px;
        width: 100%;
      }
    </style>
    <script src="http://openlayers.org/en/v3.0.0/build/ol.js" type="text/javascript"></script>
    <title>Map of San Diego</title>
  </head>
  <body>
    <h2>My Map</h2>
    <div id="map" class="map"></div>
    <script type="text/javascript">
      var map = new ol.Map({
        target: 'map',
        layers: [
          new ol.layer.Tile({
            source: new ol.source.MapQuest({layer: 'sat'})
          })
          new ol.layer.Vector({
            source: new ol.source.Vector(casinos.geojson)
          })  
        ],

        view: new ol.View({
          center: ol.proj.transform([-117.128986, 32.985368], 'EPSG:4326', 'EPSG:3857'),
          zoom: 10
        })
      });
    </script>
  </body>
</html>
Improve this question
1
  • 1
    When you say: 'It wont work', what exactly do you mean? what do you see? do you get any error?
    – Devdatta Tengshe
    Sep 22, 2014 at 3:44

1 Answer 1

Reset to default
2

I think:

new ol.layer.Vector({
    source: new ol.source.Vector(casinos.geojson)
})

should be something like:

new ol.layer.Vector({
    source: new ol.source.GeoJSON({
        url: 'casinos.geojson'
    })
})

you may need to account for its projection as well.

url: 'casinos.geojson',
projection: 'EPSG:3857'  (or whatever it is)
Improve this answer

Your Answer

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

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