Open Source GIS – OpenLayers Style Not Working in IE

javascriptopen-source-gisopenlayers-2

I'm trying to use OpenLayers to produce a map I'm using the following to style a layer in the map.

It seems to work fine in Firefox but I get javascript error in IE 'symbolizer' is null or not an object ….?
Any Ideas?

var previewVectors = new OpenLayers.Layer.Vector("previewVector", { isBaseLayer: true,

          styleMap: new OpenLayers.StyleMap({
            "default": new OpenLayers.Style({
              strokeColor: "white",
              strokeWidth: 1
            }, {
              rules: [
                new OpenLayers.Rule({
                  filter: new OpenLayers.Filter.Comparison({
                    type: OpenLayers.Filter.Comparison.EQUAL_TO,
                    property: "leUsage",
                    value: "Bulk Commodity"
                  }),
                  symbolizer: {
                    fillColor: "olive"
                  }
                }),
                new OpenLayers.Rule({
                  filter: new OpenLayers.Filter.Comparison({
                    type: OpenLayers.Filter.Comparison.EQUAL_TO,
                    property: "leUsage",
                    value: "Service Industry"
                  }),
                  symbolizer: {
                    fillColor: "pink"
                  }
                }),
                new OpenLayers.Rule({
                  filter: new OpenLayers.Filter.Comparison({
                    type: OpenLayers.Filter.Comparison.EQUAL_TO,
                    property: "leUsage",
                    value: "Car Precincts"
                  }),
                  symbolizer: {
                    fillColor: "blue"
                  }
                }),
                new OpenLayers.Rule({
                  filter: new OpenLayers.Filter.Comparison({
                    type: OpenLayers.Filter.Comparison.EQUAL_TO,
                    property: "leUsage",
                    value: "Container Trade"
                  }),
                  symbolizer: {
                    fillColor: "green"
                  }
                }),
                new OpenLayers.Rule({
                  filter: new OpenLayers.Filter.Comparison({
                    type: OpenLayers.Filter.Comparison.EQUAL_TO,
                    property: "leUsage",
                    value: "Warehousing and Container Park"
                  }),
                  symbolizer: {
                    fillColor: "navyblue"
                  }
                }),
                new OpenLayers.Rule({
                  filter: new OpenLayers.Filter.Comparison({
                    type: OpenLayers.Filter.Comparison.EQUAL_TO,
                    property: "leUsage",
                    value: "Other"
                  }),
                  symbolizer: {
                    fillColor: "brown"
                  }
                }),
            ]
            })
          })
        });

Best Answer

You have a... DEVIANT COMMA!!!

Just delete that comma after:

                symbolizer: {
                    fillColor: "brown"
                  }
                }),

evil comma breaking IE ^

Try this: alert([1,2,3,].length);

Related Question