我注意到,当我在地图上显示结果时,如果启用了聚类,则会收到两种形状。
我想将所有结果显示为人员列表,即使他们正在聚集。
地图:
如您所见,我们在1个集群上有2个人。原因是因为在数据上我们有两个形状,聚类特征和人特征。
要实现此目标,我们已经完成了下一个
在Moveend事件中,我们将人员和群集存储在2个单独的数组中:
var clusters = [];
var persons = [];
data.forEach(function (shape) {
if (typeof shape.properties !== "undefined") {
if (shape.properties.cluster) {
clusters.push(shape.properties);
}
} else if (typeof shape.properties === "undefined") {
properties = shape.getProperties();
persons.push(properties);
}
});
在Persons数组上,我们具有人员的信息,但是在clusters数组上,我们仅具有集群的信息,因此我们在该数组上进行迭代以按如下方式获取该数组的每个人,
if (clusters.length > 0) {
for (var i = 0; i < clusters.length; i++) {
datasource.getClusterLeaves(clusters[i].cluster_id).then(function (children) {
for (var i = 0; i < children.length; i++) {
children.forEach(function (personProps) {
persons.push(personProps.properties);
});
}
});
}
}
然后我按照以下步骤构建集群层,
var clusterBubbleLayer = new atlas.layer.BubbleLayer(datasource, null, {
radius: 15,
color: '#007faa',
strokeColor: 'white',
strokeWidth: 2
});
map.layers.add(clusterBubbleLayer);
var clusterLabelLayer = new atlas.layer.SymbolLayer(datasource, null, {
iconOptions: {
image: 'none',
font: ['SegoeUi-Bold'],
anchor: 'center',
allowOverlap: true,
ignorePlacement: true
},
textOptions: {
textField: '{point_count_abbreviated}',
size: 12,
font: ['StandardFont-Bold'],
offset: [0, 0.4],
color: 'white'
}
});
map.layers.add(clusterLabelLayer);
但是我想知道是否有另一种方法可以将地图的所有记录显示为聚类,即使只有一个人时也可以显示?
非常感谢!
解决方案1:
我发现使用诺言的“顺序执行”是一种不错的解决方案,
现在我有了一个Promises Array,所以每次使用getClusterLeaves方法都会返回一个Promise,然后将响应存储在数组中,
var persons = [];
var promises = [];
data.forEach(function (shape) {
if (typeof shape.properties !== "undefined") {
if (shape.properties.cluster) {
promises.push(datasource.getClusterLeaves(shape.properties.cluster_id, 9999999, 0).then((e) => {
e.forEach(function (result) {
properties = result.properties;
persons.push(properties);
});
}));
}
}
});
然后我得到了那些人,
var buildPerson = new Promise(resolve => {
data.forEach(function (shape) {
if (typeof shape.properties === "undefined") {
properties = shape.getProperties();
persons.push(properties);
}
});
resolve("solved");
});
最后,当集群功能的所有承诺完成时,我将显示所有结果,
function runSerial() {
Promise.all(promises)
.then(buildPerson)
.then(function () {
persons.forEach(function (person) {
BuildHtml(person);
});
displayNext();
});
}
runSerial();
效果很好:)