I am using openlayers 2 for making clustering on vector point data for which I am a beginner. I have installed geoserver locally via opengeo suite and using 'world_cities' dataset as an example. I have been able to implement simple cluster strategy. Now I want to display count numbers on each cluster. For example, when I start to zoom in , the big cluster should display how many element points are inside. Then when I zoom in further, the big cluster will break down and at the same time show it shoud display the reduced number of points and until it becomes 1. I would appreciate any help. Here is my code. At which position shall I place another method/rule to get numbering staff done ?
var style = new OpenLayers.Style({ pointRadius: "${radius}", fillColor: "#FF3300", fillOpacity: 0.8, strokeColor: "#66FF00", strokeWidth: "${width}", strokeOpacity: 0.8 }, { context: { width: function(feature) { return (feature.cluster) ? 2 : 1; }, radius: function(feature) { var pix = 2; if(feature.cluster) { pix = Math.min(feature.attributes.count, 7) + 2; } return pix; } } }); var wfs_layer2 = new OpenLayers.Layer.Vector("world_cities", { strategies: [new OpenLayers.Strategy.BBOX()], protocol: new OpenLayers.Protocol.WFS({ version: "1.1.0", url: "http://localhost:8081/geoserver/wfs", featureNS : "http://world.opengeo.org", featureType: "cities", }), strategies: [ new OpenLayers.Strategy.Fixed(), new OpenLayers.Strategy.Cluster({distance: 30}) ], styleMap: new OpenLayers.StyleMap({ "default": style, "select": { fillColor: "#8aeeef", strokeColor: "#32a8a9" } })});
أكثر...
var style = new OpenLayers.Style({ pointRadius: "${radius}", fillColor: "#FF3300", fillOpacity: 0.8, strokeColor: "#66FF00", strokeWidth: "${width}", strokeOpacity: 0.8 }, { context: { width: function(feature) { return (feature.cluster) ? 2 : 1; }, radius: function(feature) { var pix = 2; if(feature.cluster) { pix = Math.min(feature.attributes.count, 7) + 2; } return pix; } } }); var wfs_layer2 = new OpenLayers.Layer.Vector("world_cities", { strategies: [new OpenLayers.Strategy.BBOX()], protocol: new OpenLayers.Protocol.WFS({ version: "1.1.0", url: "http://localhost:8081/geoserver/wfs", featureNS : "http://world.opengeo.org", featureType: "cities", }), strategies: [ new OpenLayers.Strategy.Fixed(), new OpenLayers.Strategy.Cluster({distance: 30}) ], styleMap: new OpenLayers.StyleMap({ "default": style, "select": { fillColor: "#8aeeef", strokeColor: "#32a8a9" } })});
أكثر...