【Openlayers】Clusterfeature添加labels
Openlayers中加载大数据量的vectors时 其渲染效果就会很差，解决这一问题的有效方法就是对这些vectors进行Cluster
在Openlayers的官方Examples中有相关的示例：http://openlayers.org/dev/examples/strategy-cluster-threshold.html
我对这个示例做了下修改 使其clusterfeature加上lables(集聚的feature显示集聚数，没有集聚的显示自身属性)，主要添加的代码如下红色部分：
1 var style = new OpenLayers.Style({
2 pointRadius: "<%="${radius}"%>",
3 fillColor: "#ffcc66",
4 label:"<%="${name}"%>",
5 fontSize: "10px",
6 fillOpacity: 0.8,
7 strokeColor: "#cc6633",
8 strokeWidth: "<%="${width}"%>",
9 strokeOpacity: 0.8
10 }, {
11 context: {
12 width: function(feature) {
13 return (feature.cluster) ? 2 : 1;
14 },
15 radius: function(feature) {
16 var pix = 2;
17 if(feature.cluster) {
18 pix = Math.min(feature.attributes.count, 7) + 2;
19 }
20 return pix;
21 },
22 name:function(feature){
23 var name;
24 if (feature.attributes.count>1)
25 {
26 name=feature.attributes.count;
27 } else
28 {
29 name=feature.cluster[0].attributes.name;
30 }
31 return name;
32 }
33 }
34 });
效果如下：
