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

Update example to use expression parsing

Browse Source
This commit is contained in:
Tim Schaub
2013-06-26 17:51:02 -06:00
parent b7412552a5
commit aab5c8472c
2 changed files with 13 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
examples/kml-timezones.html
View File

@@ -39,7 +39,7 @@
<h4 id="title">Timezones in KML</h4>
<p id="shortdesc">Demonstrates rendering timezones from KML.</p>
<div id="docs">
<p>This example parses a KML file and renders the features as a vector layer. Note that currently the <code>kml:StyleMap</code> elements are not parsed, so the layer is given a <code>ol.style.Style</code> manually. The timezones are filled yellow with an opacity calculated based on the current offset to local noon.</p>
<p>This example parses a KML file and renders the features as a vector layer. The layer is given a <code>ol.style.Style</code> that fills timezones yellow with an opacity calculated based on the current offset to local noon.</p>
<p>See the <a href="kml-timezones.js" target="_blank">kml-timezones.js source</a> to see how this is done.</p>
</div>
<div id="tags">KML, vector, style</div>

17
examples/kml-timezones.js
View File

@@ -1,7 +1,7 @@
goog.require('ol.Expression');
goog.require('ol.Map');
goog.require('ol.RendererHint');
goog.require('ol.View2D');
goog.require('ol.expr');
goog.require('ol.layer.TileLayer');
goog.require('ol.layer.Vector');
goog.require('ol.parser.KML');
@@ -12,8 +12,15 @@ goog.require('ol.style.Polygon');
goog.require('ol.style.Rule');
goog.require('ol.style.Style');
// calculate opacity based on difference from local noon
function getOpacity(feature) {
/**
* Register a function to be used in a symbolizer. Here we want the opacity
* of polygons to be based on the offset from local noon. For example, a
* timezone where it is currently noon would have an opacity of 1. And a
* timezone where it is currently 6:00am would have an opacity of 0.5.
*/
ol.expr.register('getOpacity', function() {
var feature = this;
var opacity = 0;
var name = feature.get('name'); // e.g. GMT -08:30
var match = name.match(/([-+]\d{2}):(\d{2})$/);
@@ -31,7 +38,7 @@ function getOpacity(feature) {
opacity = 1 - offset / 12;
}
return opacity;
}
});
var style = new ol.style.Style({rules: [
new ol.style.Rule({
@@ -39,7 +46,7 @@ var style = new ol.style.Style({rules: [
new ol.style.Polygon({
fillColor: '#ffff33',
strokeColor: '#ffffff',
opacity: new ol.Expression('getOpacity(this)')
opacity: ol.expr.parse('getOpacity()')
})
]
})