[OpenLayers-Users] Attempting to get styling going on my layer.

[Andreas Hocevar]

You'll need to replace

               if (lateKiosk == 1) {
                 feature.attributes.icon = "/images/red_9x9.png";
               } else {
                 feature.attributes.icon = "/images/green_9x9.png";
               }

with

               if (lateKiosk == 1) {
                 return "/images/red_9x9.png";
               } else {
                 return "/images/green_9x9.png";
               }

Andreas.

On Tue, Mar 6, 2012 at 7:18 PM, Scott Chapman <scott at mischko.com> wrote:
> Hi!
>
> I'm close here, I think but I don't know the last piece or I'm missing
> something.
>
> I have a Vector layer that includes the Cluster strategy.  It displays
> correctly if I instantiate it without the styleMap.
>
> I made a style that should set the icon to a red image if any of the
> features have a "late" attribute of 1, green otherwise.
>
> Here's the code for the style and the layer instantiation:
>
>        var style = new OpenLayers.Style({
>            externalGraphic: "${icon}",
>          } , {
>            context: {
>            icon: function(feature) {
>              if(feature.cluster) {
>                lateKiosk = 0;
>                for(var c = 0; c < feature.cluster.length; c++) {
>                  i = feature.cluster[c].attributes.late;
>                  if( i == 1) {
>                    lateKiosk = 1;
>                    break;
>                  }
>                }
>                if (lateKiosk == 1) {
>                  feature.attributes.icon = "/images/red_9x9.png";
>                } else {
>                  feature.attributes.icon = "/images/green_9x9.png";
>                }
>              }
>              console.log(feature);
>              return feature.attributes.icon;
>            }
>            }
>            }
>          );
>
>      var stores_layer = new OpenLayers.Layer.Vector("Stores", {
>           styleMap: new OpenLayers.StyleMap({"default": style}),
>         strategies: [
>                      new OpenLayers.Strategy.Fixed(),
>                      new OpenLayers.Strategy.Refresh({interval: 60000}),
>                      new OpenLayers.Strategy.Cluster()
>                     ],
>           protocol: new OpenLayers.Protocol.HTTP(
>                      {
>                            url: "/kiosks_status_geoJSON/",
>                        headers: {'Accept':'application/json'},
>                         format: new OpenLayers.Format.GeoJSON()
>                      }
>                     )
>       });
>
> Here's the feature log from the console, showing the icon has been set:
>
> OpenLayers.Feature.Vector.OpenLayers.Class.initialize
> attributes: Object
> count: 2
> icon: "/images/red_9x9.png"
> ....
>
> Here's confirmation that the red image is getting loaded from the web server:
>
> 127.0.0.1 - - [06/Mar/2012:10:05:32] "GET /images/red_9x9.png
> HTTP/1.1" 200 183 "http://localhost:7000/source/index.html"
> "Mozilla/5.0 (X11; Linux i686) AppleWebKit/535.11 (KHTML, like Gecko)
> Ubuntu/10.04 Chromium/17.0.963.56 Chrome/17.0.963.56 Safari/535.11"
>
> I'm close but I'm missing something.  Can someone please fill in the blank?
>
> Thanks!
> Scott
> _______________________________________________
> Users mailing list
> Users at lists.osgeo.org
> http://lists.osgeo.org/mailman/listinfo/openlayers-users



-- 
Andreas Hocevar
OpenGeo - http://opengeo.org/
Expert service straight from the developers.