Javascript 隐藏的谷歌地图控件

Javascript 隐藏的谷歌地图控件,javascript,google-maps,Javascript,Google Maps,我在谷歌地图API V3上遇到了问题。地图加载正确,但zoomControl部分隐藏。虽然在屏幕截图中没有打开panControl,但panControl显示并运行良好 我尝试设置:zoomControl:true和disableDefaultUI:true,但都没有效果 我的javascript如下所示: function initializeMap(manuId, lat, lng, centerLat, centerLng,zoom){ var latlng = new google.

我在谷歌地图API V3上遇到了问题。地图加载正确,但zoomControl部分隐藏。虽然在屏幕截图中没有打开panControl,但panControl显示并运行良好

我尝试设置:
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);
}
}

摘自谷歌的API页面:

向地图添加控件

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

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

{
  panControl: boolean,
  zoomControl: boolean,
  mapTypeControl: boolean,
  scaleControl: boolean,
  streetViewControl: boolean,
  overviewMapControl: boolean
}

没有更多的信息,这有点难以确定,但当我在我的页面中包含Twitter引导时,我遇到了这个问题。具体来说,它将所有img标签的最大宽度设置为100%。我通过执行“#我的地图画布img{max width:none}”修复了这个问题,其中#我的地图画布是我地图画布的id。

你能提供一个关于JSFIDLE的代码片段吗?我想看看它是否为我呈现了相同的效果?另外,当我遇到GoogleMapAPI问题时,加载最新的JQuery库总会修复一些小错误。