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

Replace tabs in example with spaces. No functional change.

Browse Source
This commit is contained in:
Marc Jansen
2012-05-29 22:03:25 +02:00
parent 366faf6871
commit 5794502f98
1 changed files with 69 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/strategy-cluster-extended.js
+69 -69
View File
@@ -73,67 +73,67 @@ var map, vectorlayer, features, stylemap, select;
// The function that gets called on feature selection: shows information // The function that gets called on feature selection: shows information
// about the feature/cluser in a div on the page // about the feature/cluser in a div on the page
var showInformation = function(evt){ var showInformation = function(evt){
var feature = evt.feature; var feature = evt.feature;
var info = 'Last hovered feature:<br>'; var info = 'Last hovered feature:<br>';
if (feature.cluster) { if (feature.cluster) {
info += '&nbsp;&nbsp;Cluster of ' + feature.attributes.count + ' features:'; info += '&nbsp;&nbsp;Cluster of ' + feature.attributes.count + ' features:';
var clazzes = { var clazzes = {
'1': 0, '1': 0,
'2': 0, '2': 0,
'3': 0, '3': 0,
'4': 0 '4': 0
}; };
for (var i = 0; i < feature.attributes.count; i++) { for (var i = 0; i < feature.attributes.count; i++) {
var feat = feature.cluster[i]; var feat = feature.cluster[i];
clazzes[feat.attributes.clazz]++; clazzes[feat.attributes.clazz]++;
} }
for (var j=1; j<=4; j++) { for (var j=1; j<=4; j++) {
var plural_s = (clazzes[j] !== 1) ? 's' : ''; var plural_s = (clazzes[j] !== 1) ? 's' : '';
info += '<br>&nbsp;&nbsp;&nbsp;&nbsp;&bull;&nbsp;clazz ' + j + ': ' + clazzes[j] + ' feature' + plural_s; info += '<br>&nbsp;&nbsp;&nbsp;&nbsp;&bull;&nbsp;clazz ' + j + ': ' + clazzes[j] + ' feature' + plural_s;
} }
} else { } else {
info += '&nbsp;&nbsp;Single feature of clazz = ' + feature.attributes.clazz; info += '&nbsp;&nbsp;Single feature of clazz = ' + feature.attributes.clazz;
} }
document.getElementById('info').innerHTML = info; document.getElementById('info').innerHTML = info;
}; };
// The function that gets called on feature selection. Shows information // The function that gets called on feature selection. Shows information
// about the number of "points" on the map. // about the number of "points" on the map.
var updateGeneralInformation = function() { var updateGeneralInformation = function() {
var info = 'Currently ' + vectorlayer.features.length + ' points are shown on the map.'; var info = 'Currently ' + vectorlayer.features.length + ' points are shown on the map.';
document.getElementById('generalinfo').innerHTML = info; document.getElementById('generalinfo').innerHTML = info;
}; };
// instanciate the map
map = new OpenLayers.Map("map");
// background WMS // instanciate the map
map = new OpenLayers.Map("map");
// background WMS
var ol_wms = new OpenLayers.Layer.WMS("OpenLayers WMS", "http://vmap0.tiles.osgeo.org/wms/vmap0", { var ol_wms = new OpenLayers.Layer.WMS("OpenLayers WMS", "http://vmap0.tiles.osgeo.org/wms/vmap0", {
layers: "basic" layers: "basic"
}); });
// context to style the vectorlayer // context to style the vectorlayer
var context = { var context = {
getColor: function(feature){ getColor: function(feature){
var color = '#aaaaaa'; var color = '#aaaaaa';
if (feature.attributes.clazz && feature.attributes.clazz === 4) { if (feature.attributes.clazz && feature.attributes.clazz === 4) {
color = '#ee0000'; color = '#ee0000';
} else if(feature.cluster) { } else if(feature.cluster) {
var onlyFour = true; var onlyFour = true;
for (var i = 0; i < feature.cluster.length; i++) { for (var i = 0; i < feature.cluster.length; i++) {
if (onlyFour && feature.cluster[i].attributes.clazz !== 4) { if (onlyFour && feature.cluster[i].attributes.clazz !== 4) {
onlyFour = false; onlyFour = false;
} }
} }
if (onlyFour === true) { if (onlyFour === true) {
color = '#ee0000'; color = '#ee0000';
} }
} }
return color; return color;
} }
}; };
// style the vectorlayer // style the vectorlayer
stylemap = new OpenLayers.StyleMap({ stylemap = new OpenLayers.StyleMap({
'default': new OpenLayers.Style({ 'default': new OpenLayers.Style({
@@ -143,32 +143,32 @@ var map, vectorlayer, features, stylemap, select;
strokeColor: "#666666", strokeColor: "#666666",
strokeWidth: 1, strokeWidth: 1,
strokeOpacity: 1, strokeOpacity: 1,
graphicZIndex: 1 graphicZIndex: 1
}, { }, {
context: context context: context
}), }),
'select' : new OpenLayers.Style({ 'select' : new OpenLayers.Style({
pointRadius: 5, pointRadius: 5,
fillColor: "#ffff00", fillColor: "#ffff00",
fillOpacity: 1, fillOpacity: 1,
strokeColor: "#666666", strokeColor: "#666666",
strokeWidth: 1, strokeWidth: 1,
strokeOpacity: 1, strokeOpacity: 1,
graphicZIndex: 2 graphicZIndex: 2
}) })
}); });
// the vectorlayer // the vectorlayer
vectorlayer = new OpenLayers.Layer.Vector('Vectorlayer', {styleMap: stylemap, strategies: []}); vectorlayer = new OpenLayers.Layer.Vector('Vectorlayer', {styleMap: stylemap, strategies: []});
// the select control // the select control
select = new OpenLayers.Control.SelectFeature( select = new OpenLayers.Control.SelectFeature(
vectorlayer, {hover: true} vectorlayer, {hover: true}
); );
map.addControl(select); map.addControl(select);
select.activate(); select.activate();
vectorlayer.events.on({"featureselected": showInformation}); vectorlayer.events.on({"featureselected": showInformation});
map.addLayers([ol_wms, vectorlayer]); map.addLayers([ol_wms, vectorlayer]);
map.addControl(new OpenLayers.Control.LayerSwitcher()); map.addControl(new OpenLayers.Control.LayerSwitcher());
map.zoomToMaxExtent(); map.zoomToMaxExtent();
@@ -197,18 +197,18 @@ var map, vectorlayer, features, stylemap, select;
switch(this.value) { switch(this.value) {
case 'cluster': case 'cluster':
// standard clustering // standard clustering
strategies.push(new OpenLayers.Strategy.Cluster()); strategies.push(new OpenLayers.Strategy.Cluster());
break; break;
case 'attribute-cluster': case 'attribute-cluster':
// use the custom class: only cluster features of the same clazz // use the custom class: only cluster features of the same clazz
strategies.push(new OpenLayers.Strategy.AttributeCluster({ strategies.push(new OpenLayers.Strategy.AttributeCluster({
attribute:'clazz' attribute:'clazz'
})); }));
break; break;
case 'rule-cluster': case 'rule-cluster':
// use the custom class: only cluster features that have a // use the custom class: only cluster features that have a
// clazz smaller than 4 // clazz smaller than 4
strategies.push(new OpenLayers.Strategy.RuleCluster({ strategies.push(new OpenLayers.Strategy.RuleCluster({
rule: new OpenLayers.Rule({ rule: new OpenLayers.Rule({
filter: new OpenLayers.Filter.Comparison({ filter: new OpenLayers.Filter.Comparison({
type: OpenLayers.Filter.Comparison.LESS_THAN, type: OpenLayers.Filter.Comparison.LESS_THAN,
@@ -219,24 +219,24 @@ var map, vectorlayer, features, stylemap, select;
})); }));
break; break;
} }
// remove layer and control // remove layer and control
map.removeLayer(vectorlayer); map.removeLayer(vectorlayer);
map.removeControl(select); map.removeControl(select);
// rebuild layer // rebuild layer
vectorlayer = new OpenLayers.Layer.Vector('Vectorlayer', {styleMap: stylemap, strategies: strategies}); vectorlayer = new OpenLayers.Layer.Vector('Vectorlayer', {styleMap: stylemap, strategies: strategies});
map.addLayer( vectorlayer ); map.addLayer( vectorlayer );
vectorlayer.addFeatures(features); vectorlayer.addFeatures(features);
// rebuild select control // rebuild select control
select = new OpenLayers.Control.SelectFeature( select = new OpenLayers.Control.SelectFeature(
vectorlayer, {hover: true} vectorlayer, {hover: true}
); );
map.addControl(select); map.addControl(select);
select.activate(); select.activate();
vectorlayer.events.on({"featureselected": showInformation}); vectorlayer.events.on({"featureselected": showInformation});
// update meta information // update meta information
updateGeneralInformation(); updateGeneralInformation();
}; };
// bind the behviour to the radios // bind the behviour to the radios
var inputs = document.getElementsByTagName('input'); var inputs = document.getElementsByTagName('input');
for( var cnt = 0; cnt < inputs.length; cnt++) { for( var cnt = 0; cnt < inputs.length; cnt++) {
var input = inputs[cnt]; var input = inputs[cnt];