【问题标题】:Setting a max zoom level using jquery gmap3 & autoFit使用 jquery gmap3 & autoFit 设置最大缩放级别
【发布时间】:2011-10-27 07:39:26
【问题描述】:

我在 gmap3 插件上使用“autoFit”,因此它可以缩放到地图上对象的最佳水平。问题是当只有 1 个对象时,它会放大到太远的最大级别。我怎样才能让它不超过缩放级别 14?

谢谢。

【问题讨论】:

标签: jquery google-maps google-maps-api-3 jquery-gmap3


【解决方案1】:

您可以使用 maxZoom,但这会设置地图的最大缩放而不是自动调整功能。这意味着如果用户愿意,他们将无法进一步放大地图。

map:{
      center: true,
      zoom: 10,
      maxZoom: 18
    }

相反,我为每个点添加了一个隐藏的圆或半径,其大小可以使地图缩小到我想要的缩放级别。这样,用户仍然可以根据需要进一步放大。

$('#test').gmap3(
    { 
        action: 'addMarker',
        latLng: "your data input for markers",
        map:{
            center: true,
            zoom: 10
        }
    },
    { 
        action: 'addCircle',
        latLng: "your data input for markers",
        options: {
            radius : 75,
            strokeOpacity: 0,
            fillOpacity: 0,
        }
    },
    'autofit'
);

【讨论】:

    【解决方案2】:

    您可以将 maxzoom 属性添加到 gmap3 插件的 map 属性中:

    $('#test1').gmap3(
          {
            action: 'addInfoWindow',
            address: "some place name",
            map:{
              center: true,
              zoom: 5,
              maxZoom: 10
            },...
    

    【讨论】:

      【解决方案3】:

      这似乎在 gmap3 版本 5.1.1 中对我有用。只需使用 autofit:{maxZoom:14}。这告诉地图在自动调整时仅放大到 14 级,并允许用户使用鼠标或缩放控件放大或缩小。

          $(function(){
      
          $("#test").gmap3();
      
          $('#test-ok').click(function(){
            var addr = $('#test-address').val();
            if ( !addr || !addr.length ) return;
            $("#test").gmap3({
              getlatlng:{
                address:  addr,
                callback: function(results){
                  if ( !results ) return;
                  $(this).gmap3({
                    marker:{
      
                      latLng:results[0].geometry.location,
                      map:{
      
                        center: true,
      
                      },
      
                    },
                    autofit:{maxZoom: 14},
      
                  });
      
                }
              }
            });
          });
      
          $('#test-address').keypress(function(e){
            if (e.keyCode == 13){
              $('#test-ok').click();
            }
          });
        });
      

      【讨论】:

      • 非常感谢您的回答!很遗憾,gmap3 documentation for autofit 中没有提到这一点 :(
      • 不客气!是的,我同意 gmap3 的文档非常模糊,它通常需要用户进行比大多数插件更多的试验和错误。
      猜你喜欢
      • 1970-01-01
      • 2016-12-21
      • 1970-01-01
      • 2011-10-10
      • 2014-01-01
      • 2011-05-07
      • 1970-01-01
      • 2021-10-10
      相关资源
      最近更新 更多