ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add support for the extremely awesomely super-comprehensive rule based styling

Browse Source 
that Andreas has been working so hard on. I think this is the single most
awesome commit I've ever had the pleasure of committing. The results of this
commit are described on http://trac.openlayers.org/wiki/Styles: essentially,
this makes it possible to style features in all kinds of fun ways based on
rules, and will also form the underlying basis for #533. Things this patch
adds:

 * OL.Rule classes. These classes allow you to do tests against the propertie
   of a feature, and set a style based on these properties -- so you can
   compare the 'speedlimit' property of a line, and test if it is > 60, and if
   it is greater than 60, render it in a different color. You can also test
   combinations of rules using the OL.Rule.Logical class, and test featureids
   with the FeatureID class. 
 * OL.Style class: The OL.Style class lets you wrap up Rules into styles that 
   can be used with drawFeature to draw the feature in the selected style.
 * OL.Layer.Vector.drawFeature will check if the given style is an OL.Style
   object, and if so, it will draw the feature accordingly.

examples/georss-flickr.html shows usage of these classes.

Many, many thanks go to Andreas for all his hard work on this: this code really
is very pretty, and includes unit tests for all the classes (and we know that I
am a big fan of tests.)

Three cheers for Andreas: Hip hip, hooray! hip hip, hooray! hip hip, hooray!


git-svn-id: http://svn.openlayers.org/trunk/openlayers@5429 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
crschmidt
2007-12-15 16:17:50 +00:00
parent 43a4f9320b
commit fb3c02354f
15 changed files with 1851 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/OpenLayers.js
+5
View File
@@ -164,6 +164,11 @@
"OpenLayers/Renderer/VML.js",
"OpenLayers/Layer/Vector.js",
"OpenLayers/Layer/GML.js",
"OpenLayers/Style.js",
"OpenLayers/Rule.js",
"OpenLayers/Rule/FeatureId.js",
"OpenLayers/Rule/Logical.js",
"OpenLayers/Rule/Comparison.js",
"OpenLayers/Format.js",
"OpenLayers/Format/XML.js",
"OpenLayers/Format/GML.js",
lib/OpenLayers/Layer/Vector.js
+6
View File
@@ -350,6 +350,12 @@ OpenLayers.Layer.Vector = OpenLayers.Class(OpenLayers.Layer, {
style = this.style;
}
}
if (style && style.CLASS_NAME &&
style.CLASS_NAME == "OpenLayers.Style") {
style = style.createStyle(feature);
}
this.renderer.drawFeature(feature, style);
},
lib/OpenLayers/Rule.js
+90
View File
@@ -0,0 +1,90 @@
/* Copyright (c) 2006 MetaCarta, Inc., published under a modified BSD license.
* See http://svn.openlayers.org/trunk/openlayers/repository-license.txt
* for the full text of the license. */
/**
* @requires OpenLayers/Util.js
* @requires OpenLayers/Style.js
*
* Class: OpenLayers.Rule
*
* This class represents a OGC Rule, as being used for rule-based SLD styling
*/
OpenLayers.Rule = OpenLayers.Class({
/**
* APIProperty: name
* {String} name of this rule
*/
name: 'default',
/**
* Property: symbolizer
* {Object} Hash of styles for this rule. Contains hashes of feature
* styles. Keys are one or more of ["Point", "Line", "Polygon"]
*/
symbolizer: null,
/**
* APIProperty: minScale
* {Number} or {String} minimum scale at which to draw the feature.
* In the case of a String, this can be a combination of text and
* propertyNames in the form "literal ${propertyName}"
*/
minScale: null,
/**
* APIProperty: maxScale
* {Number} or {String} maximum scale at which to draw the feature.
* In the case of a String, this can be a combination of text and
* propertyNames in the form "literal ${propertyName}"
*/
maxScale: null,
/**
* Constructor: OpenLayers.Rule
* Creates a Rule.
*
* Parameters:
* options - {Object} An optional object with properties to set on the
* rule
*
* Returns:
* {<OpenLayers.Rule>}
*/
initialize: function(options) {
this.symbolizer = {};
OpenLayers.Util.extend(this, options);
},
/**
* APIMethod: destroy
* nullify references to prevent circular references and memory leaks
*/
destroy: function() {
for (var i in this.symbolizer) {
this.symbolizer[i] = null;
}
this.symbolizer = null;
},
/**
* APIMethod: evaluate
* evaluates this rule for a specific feature
*
* Parameters:
* feature - {<OpenLayers.Feature>} feature to apply the rule to.
*
* Returns:
* {boolean} true if the rule applies, false if it does not.
* This rule is the default rule and always returns true.
*/
evaluate: function(feature) {
// Default rule always applies. Subclasses will want to override this.
return true;
},
CLASS_NAME: "OpenLayers.Rule"
});
lib/OpenLayers/Rule/Comparison.js
+204
View File
@@ -0,0 +1,204 @@
/* Copyright (c) 2006-2007 MetaCarta, Inc., published under the Clear BSD
* license. See http://svn.openlayers.org/trunk/openlayers/license.txt for the
* full text of the license. */
/**
* @requires: OpenLayers/Rule.js
*
* Class: OpenLayers.Rule.Comparison
*
* This class represents the comparison rules, as being used for rule-based
* SLD styling
*
* Inherits from
* - <OpenLayers.Rule>
*/
OpenLayers.Rule.Comparison = OpenLayers.Class(OpenLayers.Rule, {
/**
* APIProperty: type
* {String} type: type of the comparison. This is one of
* - OpenLayers.Rule.Comparison.EQUAL_TO = "==";
* - OpenLayers.Rule.Comparison.NOT_EQUAL_TO = "!=";
* - OpenLayers.Rule.Comparison.LESS_THAN = "<";
* - OpenLayers.Rule.Comparison.GREATER_THAN = ">";
* - OpenLayers.Rule.Comparison.LESS_THAN_OR_EQUAL_TO = "<=";
* - OpenLayers.Rule.Comparison.GREATER_THAN_OR_EQUAL_TO = ">=";
* - OpenLayers.Rule.Comparison.BETWEEN = "..";
* - OpenLayers.Rule.Comparison.LIKE = "~";
*/
type: null,
/**
* APIProperty: property
* {String}
* name of the feature attribute to compare
*/
property: null,
/**
* APIProperty: value
* {Number} or {String}
* comparison value for binary comparisons. In the case of a String, this
* can be a combination of text and propertyNames in the form
* "literal ${propertyName}"
*/
value: null,
/**
* APIProperty: lowerBoundary
* {Number} or {String}
* lower boundary for between comparisons. In the case of a String, this
* can be a combination of text and propertyNames in the form
* "literal ${propertyName}"
*/
lowerBoundary: null,
/**
* APIProperty: upperBoundary
* {Number} or {String}
* upper boundary for between comparisons. In the case of a String, this
* can be a combination of text and propertyNames in the form
* "literal ${propertyName}"
*/
upperBoundary: null,
/**
* Constructor: OpenLayers.Rule.Logical
* Creates a logical rule (And, Or, Not).
*
* Parameters:
* params - {Object} Hash of parameters for this rule:
* -
* - value:
* options - {Object} An optional object with properties to set on the
* rule
*
* Returns:
* {<OpenLayers.Rule>}
*/
initialize: function(options) {
OpenLayers.Rule.prototype.initialize.apply(
this, [options]);
},
/**
* APIMethod: evaluate
* evaluates this rule for a specific feature
*
* Parameters:
* feature - {<OpenLayers.Feature>} feature to apply the rule to.
*
* Returns:
* {boolean} true if the rule applies, false if it does not
*/
evaluate: function(feature) {
var attributes = feature.attributes || feature.data;
switch(this.type) {
case OpenLayers.Rule.Comparison.EQUAL_TO:
case OpenLayers.Rule.Comparison.LESS_THAN:
case OpenLayers.Rule.Comparison.GREATER_THAN:
case OpenLayers.Rule.Comparison.LESS_THAN_OR_EQUAL_TO:
case OpenLayers.Rule.Comparison.GREATER_THAN_OR_EQUAL_TO:
return this.binaryCompare(feature, this.property, this.value);
case OpenLayers.Rule.Comparison.BETWEEN:
var result =
attributes[this.property] > this.lowerBoundary;
result = result &&
attributes[this.property] < this.upperBoundary;
return result;
case OpenLayers.Rule.Comparison.LIKE:
var regexp = new RegExp(this.value,
"gi");
return regexp.test(attributes[this.property]);
}
},
/**
* APIMethod: value2regex
* Converts the value of this rule into a regular expression string,
* according to the wildcard characters specified. This method has to
* be called after instantiation of this class, if the value is not a
* regular expression already.
*
* Parameters:
* wildCard - {<Char>} wildcard character in the above value, default
* is "*"
* singleChar - {<Char>) single-character wildcard in the above value
* default is "."
* escape - {<Char>) escape character in the above value, default is
* "!"
*
* Returns:
* {String} regular expression string
*/
value2regex: function(wildCard, singleChar, escapeChar) {
if (wildCard == ".") {
var msg = "'.' is an unsupported wildCard character for "+
"OpenLayers.Rule.Comparison";
OpenLayers.Console.error(msg);
return null;
}
// set UMN MapServer defaults for unspecified parameters
wildCard = wildCard ? wildCard : "*";
singleChar = singleChar ? singleChar : ".";
escapeChar = escapeChar ? escapeChar : "!";
this.value = this.value.replace(
new RegExp("\\"+escapeChar, "g"), "\\");
this.value = this.value.replace(
new RegExp("\\"+singleChar, "g"), ".");
this.value = this.value.replace(
new RegExp("\\"+wildCard, "g"), ".*");
this.value = this.value.replace(
new RegExp("\\\\.\\*", "g"), "\\"+wildCard);
this.value = this.value.replace(
new RegExp("\\\\\\.", "g"), "\\"+singleChar);
return this.value;
},
/**
* Function: binaryCompare
* Compares a feature property to a rule value
*
* Parameters:
* feature - {<OpenLayers.Feature>}
* property - {String} or {Number}
* value - {String} or {Number}, same as property
*
* Returns:
* {boolean}
*/
binaryCompare: function(feature, property, value) {
var attributes = feature.attributes || feature.data;
switch (this.type) {
case OpenLayers.Rule.Comparison.EQUAL_TO:
return attributes[property] == value;
case OpenLayers.Rule.Comparison.NOT_EQUAL_TO:
return attributes[property] != value;
case OpenLayers.Rule.Comparison.LESS_THAN:
return attributes[property] < value;
case OpenLayers.Rule.Comparison.GREATER_THAN:
return attributes[property] > value;
case OpenLayers.Rule.Comparison.LESS_THAN_OR_EQUAL_TO:
return attributes[property] <= value;
case OpenLayers.Rule.Comparison.GREATER_THAN_OR_EQUAL_TO:
return attributes[property] >= value;
}
},
CLASS_NAME: "OpenLayers.Rule.Comparison"
});
OpenLayers.Rule.Comparison.EQUAL_TO = "==";
OpenLayers.Rule.Comparison.NOT_EQUAL_TO = "!=";
OpenLayers.Rule.Comparison.LESS_THAN = "<";
OpenLayers.Rule.Comparison.GREATER_THAN = ">";
OpenLayers.Rule.Comparison.LESS_THAN_OR_EQUAL_TO = "<=";
OpenLayers.Rule.Comparison.GREATER_THAN_OR_EQUAL_TO = ">=";
OpenLayers.Rule.Comparison.BETWEEN = "..";
OpenLayers.Rule.Comparison.LIKE = "~";
lib/OpenLayers/Rule/FeatureId.js
+69
View File
@@ -0,0 +1,69 @@
/* Copyright (c) 2006-2007 MetaCarta, Inc., published under the Clear BSD
* license. See http://svn.openlayers.org/trunk/openlayers/license.txt for the
* full text of the license. */
/**
* @requires: OpenLayers/Rule.js
*
* Class: OpenLayers.Rule
*
* This class represents a ogc:FeatureId Rule, as being used for rule-based SLD
* styling
*
* Inherits from
* - <OpenLayers.Rule>
*/
OpenLayers.Rule.FeatureId = OpenLayers.Class(OpenLayers.Rule, {
/**
* APIProperty: fid
* {Array(<String>)} Feature Ids to evaluate this rule against. To be passed
* To be passed inside the params object.
*/
fids: null,
/**
* Constructor: OpenLayers.Rule.FeatureId
* Creates an ogc:FeatureId rule.
*
* Parameters:
* options - {Object} An optional object with properties to set on the
* rule
*
* Returns:
* {<OpenLayers.Rule>}
*
* Inherits from:
* - <OpenLayers.Rule>
*/
initialize: function(options) {
this.fids = [];
OpenLayers.Rule.prototype.initialize.apply(
this, [options]);
},
/**
* APIMethod: evaluate
* evaluates this rule for a specific feature
*
* Parameters:
* feature - {<OpenLayers.Feature>} feature to apply the rule to.
* For vector features, the check is run against the fid,
* for plain features against the id.
*
* Returns:
* {boolean} true if the rule applies, false if it does not
*/
evaluate: function(feature) {
for (var i=0; i<this.fids.length; i++) {
var fid = feature.fid || feature.id;
if (fid == this.fids[i]) {
return true;
}
}
return false;
},
CLASS_NAME: "OpenLayers.Rule.FeatureId"
});
lib/OpenLayers/Rule/Logical.js
+101
View File
@@ -0,0 +1,101 @@
/* Copyright (c) 2006-2007 MetaCarta, Inc., published under the Clear BSD
* license. See http://svn.openlayers.org/trunk/openlayers/license.txt for the
* full text of the license. */
/**
* @requires: OpenLayers/Rule.js
*
* Class: OpenLayers.Rule.Logical
*
* This class represents ogc:And, ogc:Or and ogc:Not rules.
*
* Inherits from
* - <OpenLayers.Rule>
*/
OpenLayers.Rule.Logical = OpenLayers.Class(OpenLayers.Rule, {
/**
* APIProperty: children
* {Array(<OpenLayers.Rule>)} child rules for this rule
*/
children: null,
/**
* APIProperty: type
* {String} type of logical operator. Available types are:
* - OpenLayers.Rule.Locical.AND = "&&";
* - OpenLayers.Rule.Logical.OR = "||";
* - OpenLayers.Rule.Logical.NOT = "!";
*/
type: null,
/**
* Constructor: OpenLayers.Rule.Logical
* Creates a logical rule (And, Or, Not).
*
* Parameters:
* options - {Object} An optional object with properties to set on the
* rule
*
* Returns:
* {<OpenLayers.Rule>}
*/
initialize: function(options) {
this.children = [];
OpenLayers.Rule.prototype.initialize.apply(
this, [options]);
},
/**
* APIMethod: destroy
* nullify references to prevent circular references and memory leaks
*/
destroy: function() {
for (var i=0; i<this.children.length; i++) {
this.children[i].destroy();
}
this.children = null;
OpenLayers.Rule.prototype.destroy.apply(this, arguments);
},
/**
* APIMethod: evaluate
* evaluates this rule for a specific feature
*
* Parameters:
* feature - {<OpenLayers.Feature>} feature to apply the rule to.
*
* Returns:
* {boolean} true if the rule applies, false if it does not
*/
evaluate: function(feature) {
switch(this.type) {
case OpenLayers.Rule.Logical.AND:
for (var i=0; i<this.children.length; i++) {
if (this.children[i].evaluate(feature) == false) {
return false;
}
}
return true;
case OpenLayers.Rule.Logical.OR:
for (var i=0; i<this.children.length; i++) {
if (this.children[i].evaluate(feature) == true) {
return true;
}
}
return false;
case OpenLayers.Rule.Logical.NOT:
return (!this.children[0].evaluate(feature));
}
},
CLASS_NAME: "OpenLayers.Rule.Logical"
});
OpenLayers.Rule.Logical.AND = "&&";
OpenLayers.Rule.Logical.OR = "||";
OpenLayers.Rule.Logical.NOT = "!";
lib/OpenLayers/Style.js
+270
View File
@@ -0,0 +1,270 @@
/* Copyright (c) 2006-2007 MetaCarta, Inc., published under the Clear BSD
* license. See http://svn.openlayers.org/trunk/openlayers/license.txt for the
* full text of the license. */
/**
* @requires OpenLayers/Util.js
* @requires OpenLayers/Feature/Vector.js
*
* Class: OpenLayers.Style
*
* This class represents a UserStyle obtained
* from a SLD, containing styling rules.
*/
OpenLayers.Style = OpenLayers.Class({
/**
* APIProperty: name
* {String}
*/
name: null,
/**
* APIProperty: layerName
* {<String>} name of the layer that this style belongs to, usually
* according to the NamedLayer attribute of an SLD document.
*/
layerName: null,
/**
* APIProperty: isDefault
* {Boolean}
*/
isDefault: false,
/**
* Property: rules
* Array({<OpenLayers.Rule>})
*/
rules: null,
/**
* Property: defaultStyle
* {Object} hash of style properties to use as default for merging
* rule-based style symbolizers onto. If no rules are defined, createStyle
* will return this style.
*/
defaultStyle: null,
/**
* Property: propertyStyles
* {Hash of Boolean} cache of style properties that need to be parsed for
* propertyNames. Property names are keys, values won't be used.
*/
propertyStyles: null,
/**
* Constructor: OpenLayers.Style
* Creates a UserStyle.
*
* Parameters:
* style - {Object} Optional hash of style properties that will be
* used as default style for this style object. This style
* applies if no rules are specified. Symbolizers defined in
* rules will extend this default style.
* options - {Object} An optional object with properties to set on the
* userStyle
*
* Return:
* {<OpenLayers.Style>}
*/
initialize: function(style, options) {
this.rules = [];
// use the default style from OpenLayers.Feature.Vector if no style
// was given in the constructor
this.setDefaultStyle(style ||
OpenLayers.Feature.Vector.style["default"]);
OpenLayers.Util.extend(this, options);
},
/**
* APIMethod: destroy
* nullify references to prevent circular references and memory leaks
*/
destroy: function() {
for (var i=0; i<this.rules.length; i++) {
this.rules[i].destroy();
this.rules[i] = null;
}
this.rules = null;
this.defaultStyle = null;
},
/**
* APIMethod: createStyle
* creates a style by applying all feature-dependent rules to the base
* style.
*
* Parameters:
* feature - {<OpenLayers.Feature>} feature to evaluate rules for
* baseStyle - {Object} hash of styles feature styles to extend
*
* Returns:
* {<OpenLayers.Feature.Vector.style>} hash of feature styles
*/
createStyle: function(feature, baseStyle) {
if (!baseStyle) {
baseStyle = this.defaultStyle;
}
var style = OpenLayers.Util.extend({}, baseStyle);
var draw = true;
for (var i=0; i<this.rules.length; i++) {
// does the rule apply?
var applies = this.rules[i].evaluate(feature);
if (applies) {
// check if within minScale/maxScale bounds
var scale = feature.layer.map.getScale();
if (this.rules[i].minScale) {
draw = scale > OpenLayers.Style.createLiteral(
this.rules[i].minScale, feature);
}
if (draw && this.rules[i].maxScale) {
draw = scale < OpenLayers.Style.createLiteral(
this.rules[i].maxScale, feature);
}
// determine which symbolizer (Point, Line, Polygon) to use
var symbolizerPrefix = feature.geometry ?
this.getSymbolizerPrefix(feature.geometry) :
OpenLayers.Style.SYMBOLIZER_PREFIXES[0];
// now merge the style with the current style
var symbolizer = this.rules[i].symbolizer[symbolizerPrefix];
OpenLayers.Util.extend(style, symbolizer);
}
}
style.display = draw ? "" : "none";
// calculate literals for all styles in the propertyStyles cache
for (var i in this.propertyStyles) {
style[i] = OpenLayers.Style.createLiteral(style[i], feature);
}
return style;
},
/**
* Method: findPropertyStyles
* Looks into all rules for this style and the defaultStyle to collect
* all the style hash property names containing ${...} strings that have
* to be replaced using the createLiteral method before returning them.
*
* Returns:
* {Object} hash of property names that need createLiteral parsing. The
* name of the property is the key, and the value is true;
*/
findPropertyStyles: function() {
var propertyStyles = {};
// check the default style
var style = this.defaultStyle;
for (var i in style) {
if (typeof style[i] == "string" && style[i].match(/\$\{\w+\}/)) {
propertyStyles[i] = true;
}
}
// walk through all rules to check for properties in their symbolizer
var rules = this.rules;
var prefixes = OpenLayers.Style.SYMBOLIZER_PREFIXES;
for (var i in rules) {
for (var s=0; s<prefixes.length; s++) {
style = rules[i].symbolizer[prefixes[s]];
for (var j in style) {
if (typeof style[j] == "string" &&
style[j].match(/\$\{\w+\}/)) {
propertyStyles[j] = true;
}
}
}
}
return propertyStyles;
},
/**
* APIMethod: addRules
* Adds rules to this style.
*
* Parameters:
* rules - {Array(<OpenLayers.Rule>)}
*/
addRules: function(rules) {
this.rules = this.rules.concat(rules);
this.propertyStyles = this.findPropertyStyles();
},
/**
* APIMethod: setDefaultStyle
* Sets the default style for this style object.
*
* Parameters:
* style - {Object} Hash of style properties
*/
setDefaultStyle: function(style) {
this.defaultStyle = style;
this.propertyStyles = this.findPropertyStyles();
},
/**
* Method: getSymbolizerPrefix
* Returns the correct symbolizer prefix according to the
* geometry type of the passed geometry
*
* Parameters:
* geometry {<OpenLayers.Geometry>}
*
* Returns:
* {String} key of the according symbolizer
*/
getSymbolizerPrefix: function(geometry) {
var prefixes = OpenLayers.Style.SYMBOLIZER_PREFIXES;
for (var i=0; i<prefixes.length; i++) {
if (geometry.CLASS_NAME.indexOf(prefixes[i]) != -1) {
return prefixes[i];
}
}
},
CLASS_NAME: "OpenLayers.Style"
});
/**
* Function: createLiteral
* converts a style value holding a combination of PropertyName and Literal
* into a Literal, taking the property values from the passed features.
*
* Parameters:
* value {String} value to parse. If this string contains a construct like
* "foo ${bar}", then "foo " will be taken as literal, and "${bar}"
* will be replaced by the value of the "bar" attribute of the passed
* feature.
* feature {<OpenLayers.Feature>} feature to take attribute values from
*
* Returns:
* {String} the parsed value. In the example of the value parameter above, the
* result would be "foo valueOfBar", assuming that the passed feature has an
* attribute named "bar" with the value "valueOfBar".
*/
OpenLayers.Style.createLiteral = function(value, feature) {
if (typeof value == "string" && value.indexOf("${") != -1) {
var attributes = feature.attributes || feature.data;
value = OpenLayers.String.format(value, attributes)
value = isNaN(value) ? value : parseFloat(value);
}
return value;
}
/**
* Constant: OpenLayers.Style.SYMBOLIZER_PREFIXES
* {Array} prefixes of the sld symbolizers. These are the
* same as the main geometry types
*/
OpenLayers.Style.SYMBOLIZER_PREFIXES = ['Point', 'Line', 'Polygon'];