我有一个OpenLayers项目,我正在制作地图和动态加载的KML。这一切都按预期工作。我的地方标记(猎人拍摄或看到的不同东西)如何相互叠加,你无法读取标签。
我想要实现的是在放大和缩小时重新渲染的聚类,但聚类点但不是显示猎人所在位置的lineString。
我是javascript(2个月)的新手,我无法在网络上的任何地方找到解决方案。
这是我的代码,
map = new OpenLayers.Map("map");
//var layer= new OpenLayers.Layer.OSM();
var layer = new OpenLayers.Layer.Google(
"Google Hybrid",
{type: google.maps.MapTypeId.HYBRID, numZoomLevels: 20});
layer.wrapDateLine=false;
map.addLayer(layer);
myStyles = new OpenLayers.StyleMap({
"default": new OpenLayers.Style({
strokeColor: "#00ffff",
strokeWidth:4,
strokeOpacity:1,
fillColor:"#003333",
fillOpacity: 1,
labelYOffset: 15,
pointRadius: 5,
label:"${label}",
fontColor:"#ff0000",
context: {
getLabel: function(f) {
if(f.attributes.label===""){
return "here"; }
return f.attributes.label;
}
}
})
})
var clusterStyle = new OpenLayers.StyleMap({
"default": new OpenLayers.Style({
strokeColor: "#00ffff",
strokeWidth:5,
strokeOpacity:1,
fillColor:"#003399",
fillOpacity: 1,
// externalGraphic: "icons/redcircle.png",
labelYOffset: 15,
pointRadius: 5,
label:"${label}",
fontColor:"#ff0000",
context: {
getLabel: function(f) {
var label="init";
if(f.cluster[0].attributes.label!=" "){
label=" "+f.cluster.getClusterCount+" "+f.cluster[0].attributes.label;}
return label;
}
}
})
})
kmlLayer = new OpenLayers.Layer.Vector("Trip", {
styleMap: myStyles,
projection: map.displayProjection,
strategies: [new OpenLayers.Strategy.Fixed()],
// new OpenLayers.Strategy.Cluster()], //causing the problem
protocol: new OpenLayers.Protocol.HTTP({
params:{ tripid:tripid},
url: "kml2.php",
readWithPOST:true,
//{userid:userid,tripid:tripid},
format: new OpenLayers.Format.KML({
// extractStyles: true,
extractAttributes: true
})
})
});
map.addLayer(kmlLayer);
var clat=(parseFloat(minlat)+parseFloat(maxlat))/2;
var clon=(parseFloat(minlon)+parseFloat(maxlon))/2;
var lonlat = new OpenLayers.LonLat(clon,clat).transform(new OpenLayers.Projection("EPSG:4326"),new OpenLayers.Projection("EPSG:900913"));
map.setCenter(lonlat);
map.zoomTo(15);
答案 0 :(得分:2)
尝试使用:
var myCluster = new OpenLayers.Strategy.Cluster({
threshold: 2, // single clusters are shown as features
shouldCluster: function(cluster, feature) {
if (feature.geometry.CLASS_NAME == "OpenLayers.Geometry.Point" &&
cluster.cluster[0].geometry.CLASS_NAME ==
"OpenLayers.Geometry.Point") {
return OpenLayers.Strategy.Cluster.prototype.shouldCluster.apply(this, arguments);
} else {
return false;
}
}
});
现在我试了一下。这段代码还可以......
但你的styleMap不是,使用:
var myStyles = new OpenLayers.StyleMap({
"default": new OpenLayers.Style({
strokeColor: "#00ffff",
strokeWidth:5,
strokeOpacity:1,
fillColor:"#003399",
fillOpacity: 1,
// externalGraphic: "icons/redcircle.png",
labelYOffset: 15,
pointRadius: 5,
label:"${getLabel}",
fontColor:"#ff0000"
}, {
context: {
getLabel: function(f) {
var label="init";
if (f.cluster) { // is a cluster
if (f.cluster[0].attributes.label!=" ") {
label= " " + f.attributes.count + " " +
f.cluster[0].attributes.label;
} else {
label= " " + f.attributes.count + "init";
}
} else { // is not cluster
if (f.attributes.label!=" ") {
label= " " + f.attributes.label;
}
}
return label;
}
}
})
});
...并使用它:
kmlLayer = new OpenLayers.Layer.Vector("Trip", {
styleMap: myStyles,
projection: map.displayProjection,
strategies: [new OpenLayers.Strategy.Fixed(),
myCluster],
...