Changes between Version 2 and Version 3 of Styles

Show
Ignore:
Timestamp:
01/27/08 13:48:12 (5 years ago)
Author:
ahocevar
Comment:

--

Legend:

Unmodified
Added
Removed
Modified

  • Styles

    v2 v3  
    5858In the example, we only used the Comparison rule, and only its subtype EQUAL_TO. There are other subtypes. like LESS_THAN, BETWEEN or LIKE. And there are other rule types, with !FeatureId being the simplest. A !FeatureId rule holds an array of feature ids (fid) that it will apply to. There is also the Logical rule, which allows building more rules by concatenating them using boolean operators (AND, OR, NOT). A Logical rule (except NOT) can have child rules. 
    5959 
    60 Every rule can have a minScale and a maxScale property. This allows us to specify scale ranges to which the rule should apply. We might e.g. want to show small points at small scales, but image thumbnails at large scales. The result of such rules can be seen in the [http://dev.openlayers.org/sandbox/ahocevar/styles/examples/sld.html sld] example: Zooming in one level will reveal two additional blue lakes. The styles and rules from this example do not come from javascript-created style and rule objects, but from a SLD document read in by !OpenLayers.Format.SLD (#533). 
     60Every rule can have a minScaleDenominator and a maxScaleDenominator property. This allows us to specify scale ranges to which the rule should apply. We might e.g. want to show small points at small scales, but image thumbnails at large scales. The result of such rules can be seen in the [http://www.openlayers.org/dev/examples/sld.html sld] example: Zooming in one level will turn two lakes into blue. The styles and rules from this example do not come from javascript-created style and rule objects, but from a SLD document read in by !OpenLayers.Format.SLD (#533). 
    6161 
    6262With SLD, styles are grouped into named layers (!NamedLayer), which again have a set of named user styles (!UserStyle). This is the reason why the Style object also has layerName and name properties. For each named layer, there can be a default style. This is marked by setting the isDefault property of the Style object to true. 
    6363 
    64 == Using Styles Without Calling drawFeature Manually == 
    65 The code snippets above use the vector layer's drawFeature method to actually draw the feature with the calculated style. When working with layers, you will not want to do that. As long as !OpenLayers uses the simple style hashes for styling, you can still get easier handling of the styles by overriding the drawFeature method of !OpenLayers.Layer.Vector or the select method of !OpenLayers.Feature.!SelectFeature for selected features. Other classes that render vector features can be extended in a similar manner: 
    66 {{{ 
    67 // replaces OpenLayers.Layer.Vector.drawFeature 
    68 var drawFeature = function(feature) { 
    69     feature.style = feature.layer.style.createStyle(feature); 
    70     OpenLayers.Layer.Vector.prototype.drawFeature.apply(feature.layer, arguments); 
    71 } 
    72 var vectorLayer = new OpenLayers.Layer.Vector("Vector Layer", { 
    73         drawFeature: drawFeature}); 
    74  
    75 // replaces OpenLayers.Control.SelectFeature.select 
    76 var select = function(feature) { 
    77     // store layer style 
    78     var style = feature.layer.style; 
    79     // set temporary layer style for hover rendering 
    80     feature.layer.style = hover.selectStyle; 
    81     OpenLayers.Control.SelectFeature.prototype.select.apply(hover, arguments); 
    82     // restore layer style 
    83     feature.layer.style = style; 
    84 } 
    85 var selectControl = new OpenLayers.Control.SelectFeature({ 
    86         select: select}); 
    87 }}} 
    88  
    89 To use the above, the style property of !OpenLayers.Layer.Vector has to be a Style object instead of a style hash. The same is true for the selectStyle property of !OpenLayers.Control.!SelectFeature. 
     64== Using Styles with Control.!SelectFeature == 
     65The above can not only be used with feature or layer styles, but also with the !SelectFeature control. In that case, the selectStyle property of the control has to be set with a Style object. 
    9066 
    9167== Ideas For The Integration of !OpenLayers.Style == 
    92 With a look at not only SLD, but also KML, styling should probably be handled using !StyleMaps. Like we have a hash of style constants in !OpenLayers.Feature.Vector now (with keys "default", "select" and "temporary"), or different !UserStyles for each !NamedLayer in SLD, future style properties for layers (e.g. !OpenLayers.Layer.Vector.style) could be a hash of Style objects, keyed by a rendering intent. There could be well-known rendering intents like "default" or "select", and application developers can use arbitrary intent strings for custom functionality. This would allow us to remove properties like selectStyle from !OpenLayers.Control.!SelectFeature, because this control can rely on a style!["select"] in the layer it uses. 
     68With a look at not only SLD, but also KML, styling should probably be handled using !StyleMaps. Like we have a hash of style constants in !OpenLayers.Feature.Vector now (with keys "default", "select" and "temporary"), or different !UserStyles for each !NamedLayer in SLD, a future style object for Feature (and Layer) could be a complex object that holds a hash of Style objects, keyed by a rendering intent.  It could also store the current render intent of a feature, making the Feature.originalStyle property that Control.!SelectFeature sets unnecessary. There could be well-known rendering intents like "default" or "select", and application developers can use arbitrary intent strings for custom functionality. This would allow us to remove properties like selectStyle from !OpenLayers.Control.!SelectFeature, because this control can rely on a style!["select"] in the features it uses. 
    9369 
    94 The best way to implement this is probably in a modified !OpenLayers.Renderer.drawFeature (and the according layer.drawFeature) method, which can be designed to be backwards compatible: 
    95 {{{ 
    96 /** 
    97  * Method: drawFeature 
    98  * Draw the feature.  The optional renderIntent argument can be used 
    99  * to override the feature's default style.  This method should only 
    100  * be called from layer.drawFeature(). 
    101  * 
    102  * Parameters: 
    103  * feature - {<OpenLayers.Feature.Vector>}  
    104  * renderIntent - {<String>} can also be a style hash for backwards compatibility 
    105  */ 
    106 drawFeature: function(feature, renderIntent) { 
    107     var style; 
    108     if (renderIntent) { 
    109         if (typeof renderIntent != "string") { 
    110             // renderIntent is a style hash -> compatibility mode 
    111             style = renderIntent; 
    112         } else if(feature.style[renderIntent]) { 
    113             // style with renderIntent exists 
    114             style = feature.style[renderIntent].createStyle(feature); 
    115         } else { 
    116             // render intent not found, use default style instead 
    117             style = feature.style["default"].createStyle(feature); 
    118         } 
    119     } else { 
    120         style = feature.style; 
    121     } 
    122     this.drawGeometry(feature.geometry, style, feature.id); 
    123 }, 
    124 }}} 
    125 The select method of !OpenLayers.Control.!SelectFeature could then look like this (again, with backwards compatibility): 
    126 {{{ 
    127 select: function(feature) { 
    128     this.layer.selectedFeatures.push(feature); 
    129     // backwards compatibility: use selectStyle property 
    130     var style = this.selectStyle; 
    131     // if no selectStyle property, set renderIntent 
    132     if (!style) { 
    133         style = "select"; 
    134     } 
    135     this.layer.drawFeature(feature, style); 
    136     this.onSelect(feature); 
    137 }, 
    138 }}} 
     70Discussion on this new !StyleMap object (or whatever it will be called) can also be found in the comments for #1120.