2

我在使用 Google Maps API V3 时遇到问题。地图加载正确，但 zoomControl 部分隐藏。panControl 显示并完美运行，尽管在屏幕截图中它没有打开。

谷歌地图 SS - 没有缩放控制

我试过设置：zoomControl: true也disableDefaultUI: true无济于事。

我的javascript如下：

function initializeMap(manuId, lat, lng, centerLat, centerLng,zoom){
 var latlng = new google.maps.LatLng(centerLat, centerLng);
    var myOptions = {
      zoom: zoom,
      center: latlng,
      disableDefaultUI: true,
      zoomControl: true,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      scrollwheel: false,
      draggable : true
    };

    var mapDiv = document.getElementById("map_canvas");
    if(!mapDiv){
        var mapDiv = document.getElementById("map_canvas_"+manuId);
    }
    var map = new google.maps.Map(mapDiv,
        myOptions);


    var myLatlng = new google.maps.LatLng(lat,lng);

    var marker = new google.maps.Marker({
        position: myLatlng, 
        map: map
    }); 
    getPolygon(manuId, map);    
}

var map;

function showManuMap(manuId, container, manuLat, manuLon, locLat, locLon, zoom){
showManuMap(manuId, container, manuLat, manuLon, locLat, locLon, zoom, null);
}

function showManuMap(manuId, container, manuLat, manuLon, locLat, locLon, zoom, marker){
map = new google.maps.Map(jQuery("#" + container)[0], {
    zoom: zoom,
    center: new google.maps.LatLng(manuLat, manuLon),
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    disableDefaultUI: true,
    zoomControl: true,
    scrollwheel: false,
    draggable : true
});

if (locLat && locLon) {
    new google.maps.Marker({
        position: new google.maps.LatLng(locLat, locLon), 
        map: map,
        icon : "https://www.google.com/intl/en_us/mapfiles/ms/micons/blue-dot.png"
    }); 
}
if (marker != null) {
    new google.maps.Marker({
        position: new google.maps.LatLng(manuLat, manuLon), 
        map: map,
        icon: marker
    });
} else {
    new google.maps.Marker({
        position: new google.maps.LatLng(manuLat, manuLon), 
        map: map
    }); 
}
if (manuId) {
    getPolygon(manuId, map);
}
}
4

2 回答 2

1

如果没有更多信息，很难确定，但是当我在我的页面中包含 Twitter 引导程序时，我遇到了这个问题。具体来说，它将所有 img 标签的最大宽度设置为 100%。我通过执行“#my-map-canvas img { max-width: none }”解决了这个问题，其中 #my-map-canvas 是我的地图的画布 ID。

于 2013-12-10T12:51:20.613 回答
0

取自 Google 的 API 页面：https ://developers.google.com/maps/documentation/javascript/controls#Adding_Controls_to_the_Map

向地图添加控件

您可能希望通过删除、添加或修改 UI 行为或控件来定制您的界面，并确保未来的更新不会改变这种行为。如果您只想添加或修改现有行为，则需要确保将控件显式添加到您的应用程序中。

某些控件默认显示在地图上，而其他控件则不会出现，除非您特别要求。在地图中添加或删除控件在以下 MapOptions 对象的字段中指定，您将其设置为 true 以使它们可见或设置为 false 以隐藏它们：

{
  panControl: boolean,
  zoomControl: boolean,
  mapTypeControl: boolean,
  scaleControl: boolean,
  streetViewControl: boolean,
  overviewMapControl: boolean
}
于 2013-07-30T19:16:11.100 回答