繁体   English   中英

Azure 映射集群 position 差异

[英]Azure maps cluster position discrepancies

我有一个从 ms 端点检索的位置列表,如下所示:
https://atlas.microsoft.com/search/fuzzy/json?top=100&typeahead=true&subscription-key=subscription-key&api-version=1&query=Leeds
然后,用户选择建议的地址之一,然后使用此端点提供的 position 显示在使用集群的 map 上。 例如,对于利兹,我有以下内容:-1.548567, 53.801277

但是,当我在创建HtmlMarkerLayer时提供的clusterRenderCallback function 中创建集群时,我得到的位置与我提供的位置接近,但不同,我不知道如何或为什么。

所以代码看起来像:
首先我创建数据源

dataSource = new atlas.source.DataSource(null, {
  //Tell the data source to cluster point data.
  cluster: true
});
map.sources.add(dataSource);

然后我在HtmlMarkerLayer创建中管理集群创建:

clusterRenderCallback: function (id, position, properties) {
  var cluster = new atlas.HtmlMarker({
    position: position, // different position to that which I have provided
    htmlContent: `<div>${properties.point_count_abbreviated}</div>`,
    values: properties,
  });

  map.events.add('click', cluster, clusterClicked);

  return cluster;
}

在这里,我创建点以添加到我的数据源:

let features = list.map(x => new atlas.data.Feature(new atlas.data.Point(new atlas.data.Position(x.lon, x.lat)), x));
dataSource.add(features);

例如,我为利兹集群收到的 position 是 -1.549072265625、53.80065082633024,即使我在利兹有 2 个位置,它们都是由相同的坐标组成:-1.548567、53.801277
似乎在 atlas 代码中有某种机制可以“修复”提供的坐标; 任何人都知道如何阻止这个或我在这里做错了什么?

==编辑 02/05==

好的,所以按照@rbrundritt 的回答,这是我应该添加的最后一点代码,显示了单击集群后我们所做的事情:

function clusterClicked(e) {
  var cluster = e.target;

  datasource.getClusterExpansionZoom(cluster.properties.cluster_id).then(function (zoom) {

    map.setCamera({
      center: cluster.getOptions().position,
      zoom: zoom
    });
  });

}

这就是我们遇到这种差异的问题所在——点击集群会放大到集群中断的缩放级别; however, since we centre the map to the cluster position, the pin position, being different to the cluster one, is not being seen in the map on that zoom level (ie 3 afair). 最重要的是,我们无法知道在这个 function 的上下文中集群对应的引脚是什么,这给我们留下了一个错误的行为。

簇应该很少与它们包含的任何点具有相同的坐标。 集群将重叠点组合在一起,平均 position 用于表示 map 上的该组。 当一个簇分裂成其各个点时,该标记将具有原始 position 值。

好的,所以我不知道datasource.getClusterLeaves方法返回了什么(我只是将叶子误认为是动词离开)。 这就是我一直在寻找的,所以我的代码现在看起来像这样:

function inSamePosition(pos1, pos2) {
  return pos1.data.geometry.coordinates[0] == pos2.data.geometry.coordinates[0] 
    && pos1.data.geometry.coordinates[1] == pos2.data.geometry.coordinates[1];
}

function clusterClicked(e) {
  var cluster = e.target;
  (cluster.properties.cluster_id, Number.POSITIVE_INFINITY, 0).then(pins => {
    let position = pins.every(p => inSamePosition(p, pins[0])) ? pins[0]['data'].geometry.coordinates : null;
    datasource.getClusterExpansionZoom(cluster.properties.cluster_id).then(function (zoom) {
      map.setCamera({
        center: position ? position : cluster.getOptions().position,
        zoom: zoom
      });
    });
  })
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM