Angular 2获取地图的当前缩放级别 [英] Angular 2 get current zoom level of map

问题描述

我有一个自定义地图，它们与它们所属的同一位置上的标记相匹配，但是当我放大标记或地图有点偏移时。现在我使用 overlayview 作为标记，该类位于文件google-maps-types.ts那里，我设置标记的中心点。所以我真正想要的是获得当前的缩放以制作if语句，以每个缩放改变中心点。

这是一个

我在google-map-types中尝试过，但我真的不想在类OverlayViewBla中编辑它：

  this.overlayView.getZoom = function（）{
 console.log（this._mapsWrapper）; 
 
 google.maps.event.addDomListener（this._mapsWrapper，'zoom_changed'，function（event：any）{
 google.maps.event.trigger（this._mapsWrapper，zoom_changed ）; 
 console.log（this._mapsWrapper）; 
 var zoom = this._mapsWrapper.getZoom（）; 
 console.log（zoom）; 
}）; 
} 
  

这是btw不起作用的。
或简单地将... px添加到叠加层的顶部位置，这就是我想要在google-map.ts中做什么的好选择？

如果有人可以帮我解决这个问题，你会帮助我很多！

maps.OverlayView 支持函数 getMap（），如文档。所以从你的overlayView对象中获得缩放级别应该是这样简单的：

  this.overlayView.getZoom = function（）{ 
 var my_map = this.overlayView.getMap（）; 
 if（my_map）{//有时，地图可能尚未设置，只有在您添加覆盖图到地图
后才会设置地图返回my_map.getZoom（）; 
} 
返回null; 
} 
  

I have a custom map which match the markers on the exact same position where they belong but when I zoom in the markers or the map is a bit shifted. Now I use an overlayview as an marker, which class is in the file google-maps-types.ts thats where I set the center point of the marker. So What I really want is to get the current zoom there to make an if statement, to change the center point with each zoom.

Here is a PLUNKER, so basically what I want is to get the current zoom level in google-map-types.ts so I can acces that and change the point of the marker. Or vice versa, get the position of the marker in directives/google-map.ts.

But I do not think thats a proper way of doing this, I want to update its position (shift a little bit up) when zoom is changed..

as you see at this image at zoom level 18 the markers are a little bit shifted:

What I have tried in google-map-types but I really do not want to edit it in the class OverlayViewBla:

this.overlayView.getZoom = function () {
  console.log(this._mapsWrapper);

  google.maps.event.addDomListener(this._mapsWrapper,'zoom_changed', function(event: any) {
    google.maps.event.trigger(this._mapsWrapper, "zoom_changed");
    console.log(this._mapsWrapper);
    var zoom =  this._mapsWrapper.getZoom();
    console.log(zoom);
  });
}

And this is btw not working. Or simply add ...px to the top position of the overlay, thats what I want to do in google-map.ts what are good options?

If anyone could help me out on this you will help me a lot!!

解决方案

google.maps.OverlayView supports function getMap(), as indicated by the documentation. So getting the zoom level from within your overlayView object should be as simple as:

this.overlayView.getZoom = function () {
  var my_map = this.overlayView.getMap();
  if(my_map){ //sometimes, the map might not be set yet, it gets set only after you add the overlay to map
      return my_map.getZoom();
  }
  return null;
}

这篇关于Angular 2获取地图的当前缩放级别的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！