2

Google Maps API V3 に問題があります。マップは正しく読み込まれますが、zoomControl が部分的に非表示になっています。panControl が表示され、完全に機能しますが、スクリーンショットではオンになっていません。

Google マップ SS - zoomControl なし

私は設定を試みました：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 に答える