0

I am trying to apply a pre-defined fill-style for my vector layer but I face an error. The firebug says the following:

SyntaxError: missing } after property list


style:myStyle

I tried to put a "}" afther the property list, but the debugger keeps saying the same. I also tried to check my Javascript code with JSHint, but it also says the same problem. Last but not least I tried to look for some solution in this site and stackoverflow too, but I could not find any for my case :\ I am of the opinion that I put the "style: myStyle" line on a wrong place...

Can anyone help me?

My source code:

<!doctype html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="http://openlayers.org/en/v3.10.1/css/ol.css" type="text/css">
    <style>
      .map {
        height: 400px;
        width: 100%;
      }
    </style>
    <script src="http://openlayers.org/en/v3.10.1/build/ol.js" type="text/javascript"></script>
      <!--
     <script src="/home/mirind4/WebDevelopement/OpenLayers/openlayers/externs/ol3-aswcr/ol-aswcr.js" type="text/javascript"></script>
      -->
    <title>OpenLayers 3 example</title>
  </head>
  <body>
    <h2>My Map</h2>
    <div id="map" class="map"></div>
    <script type="text/javascript">

        //Holds the Polygon feature  
        var polyFeature = new ol.Feature({
            geometry: new ol.geom.Polygon([
                [
                    [10.689697265625, -25.0927734375],
                    [34.595947265625, -20.1708984375],
                    [38.814697265625, -35.6396484375],
                    [13.502197265625, -39.1552734375],
                    [10.689697265625, -25.0927734375]
                ]

            ])
        });
        polyFeature.getGeometry().transform('EPSG:4326', 'EPSG:3857'); 

        //Self defined style
        var myStlye = new ol.style.Style ({
          fill: new ol.style.Fill({
             color: 'rgba(255,100,50,0.5)'
           })                                
        });


        //A vector layer to hold the features
        var vectorLayer = new ol.layer.Vector({
            source: new ol.source.Vector({
                features: [
                polyFeature
                ]

            })
            style: myStyle
        });



        var map = new ol.Map({
          target: 'map',
          layers: [
            new ol.layer.Tile({
              source: new ol.source.MapQuest({layer: 'sat'})
            }),

            vectorLayer   
          ],
          view: new ol.View({
          center: [2952104.019976033, -3277504.823700756],
          zoom: 4
          })
        });
    </script>
  </body>
</html>
1

you are missing a comma

var vectorLayer = new ol.layer.Vector({
            source: new ol.source.Vector({
                features: [
                polyFeature
                ]

            }),//here you miss the comma
            style: myStyle
        });

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.