放大/缩小时,图标图像出现在不同的位置

时间:2019-02-08 05:45:59

标签: angular openlayers-5

当我放大和缩小地图时,图标会更改其位置。我分享了我的代码段。我需要知道如何在缩放时将标记保持在相同的纬度和经度位置吗?任何帮助将不胜感激。

var featureList = [];
for (var i = 0; i < this.mapsList.data.length; i++) {
  var feature = new Feature({
    geometry: new Point([this.mapsList.data[i].PosX,
    this.mapsList.data[i].PosY]),
    ItemID: this.mapsList.data[i].ItemID
  });

  var iconStyle = new Style({
    image: new Icon(
          /** @type {module:ol/style/Icon~Options} */({
        anchor: [0.5, 46],
        anchorXUnits: 'fraction',
        anchorYUnits: 'pixels',
        // scale: this.mapsList.map_meta[0].Scale,
        opacity: 0.75,
        src: 'assets/' + this.mapsList.data[i].IconName
      })
    )
  });

  feature.setStyle(iconStyle);
  featureList.push(feature);
}
var vectorLayer = new VectorLayer({
  source: new VectorSource({
    features: featureList
  })
});
var map = new Map({
  layers: [layer, vectorLayer],
  overlays: [overlay],

  target: 'map',
  /*  */
  view: new View({
    center: [0, 0],
    zoom: 1,
    // adjust zoom levels to those provided by the source
    resolutions: layer
      .getSource()
      .getTileGrid()
      .getResolutions(),
    // constrain the center: center cannot be set outside this extent
    extent: extent
  })
});

0 个答案:

没有答案