谷歌地图隐藏Div溢出半地图

时间:2015-03-18 09:03:16

标签: javascript html google-maps dom google-maps-api-3

我正在使用Google地图,使用Drawning Manager

    var latlng = new google.maps.LatLng(41.7318187, 44.8627138);

    var mapOptions = {
        zoom: 8,
        center: latlng,
        disableDoubleClickZoom: true
    }

    bounds = new google.maps.LatLngBounds();

    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
    //Define a symbol using SVG path notation, with an opacity of 1.
    var lineSymbol = {
        path: 'M 0,-1 0,1',
        strokeOpacity: 1,
        scale: 4
    };

    drawingManager = new google.maps.drawing.DrawingManager({
        drawingControl: true,
        drawingControlOptions: {
            position: google.maps.ControlPosition.TOP_CENTER,
            drawingModes: [
                google.maps.drawing.OverlayType.MARKER,
                google.maps.drawing.OverlayType.POLYLINE
            ]
        },
        markerOptions: {
            icon: $imgFolderFullPath + '/' + $('#TourObjectType').val() + '.png',
            draggable: true
        },
        polylineOptions: {
            strokeColor: $("#LineType").val()
        }
    });


    drawingManager.setMap(map);

问题是当地图渲染一些隐藏了可见性的元素而z-index 107溢出了地图的一半而我无法在该部分中插入,编辑,移动,多边形线和标记

enter image description here

有问题的部分的DOM结构如下所示:

<div style="transform: translateZ(0px); position: absolute; left: 0px; top: 0px; z-index: 107; width: 100%;">
  <div style="cursor: default; width: 53px; height: 191px; visibility: hidden;">...</div>
</div>

并且当我评论隐藏在上面的代码片段中的可见性时,地图上会显示带有星标的白色评论框

我该知道导致问题的原因

2 个答案:

答案 0 :(得分:1)

我无法告诉你为什么会发生这种情况,只有对我来说这也是在文档中提供的示例中。你不能在那个区域画画,但你可以放大它等等。 https://developers.google.com/maps/documentation/javascript/examples/drawing-tools

编辑:这似乎是签到模式的错误,因为@MrUpsidown指出

答案 1 :(得分:1)

使用 signed_in=true 时会发生这种情况。

错误报告https://code.google.com/p/gmaps-api-issues/issues/detail?id=7788

我在错误报告中添加了此帖子的链接以供参考。希望Google能尽快解决这个问题。