mapkit.js: 选中和取消选中注释时如何实现放大和缩小

如何解决mapkit.js: 选中和取消选中注释时如何实现放大和缩小

我正在使用 JavaScript 为我的网站实现苹果地图。我的网站显示了许多附近的酒店以供搜索位置查询。所以如果你搜索金门大桥，它会在附近绘制近60-70家酒店，用户可以点击并获取特定酒店的信息。我想要实现的是当用户点击注释时，地图应该放大到该注释，一旦用户返回，这应该缩小到之前的缩放级别，以便所有标记都应该可见。

此外，对于着陆页，我已将区域设置为旧金山，但我的地图设置在中东。

这是我的代码

$(document).ready(function){

    //this is the first code which is landing me in middle east
    map = new mapkit.Map("map");
    var coord = new mapkit.Coordinate(37.3382082,-121.8863286);
    var zoomlevel = new mapkit.CoordinateSpan(.001);
    var zoomOut = new mapkit.CoordinateSpan(0.004);
    var region = new mapkit.CoordinateRegion(coord,zoomlevel);
    map.setRegionAnimated(region);

    //when click on annotaion
    var coordinate  = data.coordinate; //data would be hotel data
    var region = new mapkit.CoordinateRegion(coordinate,zoomlevel);
    map.setRegionAnimated(region);

    // when going back
    var selectedCordinate   = map.selectedAnnotation.coordinate;
    var region = new mapkit.CoordinateRegion(selectedCordinate,zoomOut);
    map.setRegionAnimated(region);
 });

正在放大，但在我将其设置为 0.004 进行缩小时，每个区域的表现都不同。如果我在地图上有很多标记，那么它的行为就会不同，但如果我的标记较少，那么它的行为就会完全不同。我想要一个动态解决方案，以便它适用于所有类型的区域。