Google Maps API v3无法使用折线标记

时间:2017-07-27 21:05:09

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

在将display: none设置为地图容器后,我无法将包含折线标记的Google地图居中。

最初,地图显示正确,但在切换hide() / show()后,地图居中,以便折线标记位于左下角。我也尝试过建议的解决方案来使用google.maps.event.trigger(map, "resize");,但它没有解决它。

该片段。请注意,某些输入更改会触发initMap

function initMap() {
    mapContainer = $("#mapContainer");
    mapObject = document.getElementById('map');

    if (substance === "NO2") {
        mapContainer.show();

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

        map = new google.maps.Map(mapObject, {
            center: center,
            zoom: 12,
            mapTypeControl: false,
            streetViewControl: false
        });

        const point = new google.maps.LatLng(
            parseFloat(lat),
            parseFloat(lng)
        );

        var marker = new MarkerWithLabel({
            position: point,
            map: map,
            draggable: true,
            raiseOnDrag: true,
            labelContent: "123",
            labelAnchor: new google.maps.Point(15, 65),
            labelClass: "icon",
            labelInBackground: false,
            icon: {
                path: 'M 0,0 C -2,-20 -10,-22 -10,-30 A 10,10 0 1,1 10,-30 C 10,-22 2,-20 0,0 z',
                fillColor: colorBackground,
                fillOpacity: 1,
                strokeColor: colorBorder,
                strokeWeight: 1,
                scale: 2
            }
        });
    } else {
        $(mapContainer).hide();
    }
}

0 个答案:

没有答案