Use closure for styles & fix case

This commit is contained in:
Antoine Abt
2014-02-10 10:38:28 +01:00
parent 919fbe335f
commit 25ba60db9f
+17 -23
View File
@@ -21,20 +21,15 @@ var raster = new ol.layer.Tile({
}) })
}); });
var styleFunction = (function() {
var styles = {};
var image = new ol.style.Circle({ var image = new ol.style.Circle({
radius: 5, radius: 5,
fill: null, fill: null,
stroke: new ol.style.Stroke({color: 'orange', width: 2}) stroke: new ol.style.Stroke({color: 'orange', width: 2})
}); });
styles['Point'] = [new ol.style.Style({image: image})];
var styleFunction = function(feature) { styles['Polygon'] = [new ol.style.Style({
switch (feature.getGeometry().getType()) {
case 'Point':
return [new ol.style.Style({
image: image
})];
case 'Polygon':
return [new ol.style.Style({
stroke: new ol.style.Stroke({ stroke: new ol.style.Stroke({
color: 'blue', color: 'blue',
width: 3 width: 3
@@ -43,15 +38,13 @@ var styleFunction = function(feature) {
color: 'rgba(0, 0, 255, 0.1)' color: 'rgba(0, 0, 255, 0.1)'
}) })
})]; })];
case 'MultiLineString': styles['MultiLinestring'] = [new ol.style.Style({
return [new ol.style.Style({
stroke: new ol.style.Stroke({ stroke: new ol.style.Stroke({
color: 'green', color: 'green',
width: 3 width: 3
}) })
})]; })];
case 'MultiPolygon': styles['MultiPolygon'] = [new ol.style.Style({
return [new ol.style.Style({
stroke: new ol.style.Stroke({ stroke: new ol.style.Stroke({
color: 'yellow', color: 'yellow',
width: 1 width: 1
@@ -60,8 +53,7 @@ var styleFunction = function(feature) {
color: 'rgba(255, 255, 0, 0.1)' color: 'rgba(255, 255, 0, 0.1)'
}) })
})]; })];
default: styles['default'] = [new ol.style.Style({
return [new ol.style.Style({
stroke: new ol.style.Stroke({ stroke: new ol.style.Stroke({
color: 'red', color: 'red',
width: 3 width: 3
@@ -71,8 +63,10 @@ var styleFunction = function(feature) {
}), }),
image: image image: image
})]; })];
} return function(feature, resolution) {
return styles[feature.getGeometry().getType()] || styles['default'];
}; };
})();
var vectorSource = new ol.source.GeoJSON( var vectorSource = new ol.source.GeoJSON(
/** @type {olx.source.GeoJSONOptions} */ ({ /** @type {olx.source.GeoJSONOptions} */ ({
@@ -165,7 +159,7 @@ var vectorLayer = new ol.layer.Vector({
var overlayStyle = (function() { var overlayStyle = (function() {
var styles = {}; var styles = {};
styles['polygon'] = [ styles['Polygon'] = [
new ol.style.Style({ new ol.style.Style({
fill: new ol.style.Fill({ fill: new ol.style.Fill({
color: [255, 255, 255, 0.5] color: [255, 255, 255, 0.5]
@@ -184,9 +178,9 @@ var overlayStyle = (function() {
}) })
}) })
]; ];
styles['multipolygon'] = styles['polygon']; styles['MultiPolygon'] = styles['Polygon'];
styles['linestring'] = [ styles['LineString'] = [
new ol.style.Style({ new ol.style.Style({
stroke: new ol.style.Stroke({ stroke: new ol.style.Stroke({
color: [255, 255, 255, 1], color: [255, 255, 255, 1],
@@ -200,9 +194,9 @@ var overlayStyle = (function() {
}) })
}) })
]; ];
styles['multilinestring'] = styles['linestring']; styles['MultiLineString'] = styles['LineString'];
styles['point'] = [ styles['Point'] = [
new ol.style.Style({ new ol.style.Style({
image: new ol.style.Circle({ image: new ol.style.Circle({
radius: 7, radius: 7,
@@ -217,9 +211,9 @@ var overlayStyle = (function() {
zIndex: 100000 zIndex: 100000
}) })
]; ];
styles['multipoint'] = styles['point']; styles['MultiPoint'] = styles['Point'];
styles['geometrycollection'] = styles['polygon'].concat(styles['point']); styles['GeometryCollection'] = styles['Polygon'].concat(styles['Point']);
return function(feature, resolution) { return function(feature, resolution) {
return styles[feature.getGeometry().getType()]; return styles[feature.getGeometry().getType()];