应用css3缩放属性后，Google map pin click不起作用_Css_Google Maps_Css Transitions

应用css3缩放属性后，Google map pin click不起作用

css google-maps

应用css3缩放属性后，Google map pin click不起作用,css,google-maps,css-transitions,Css,Google Maps,Css Transitions,应用css3缩放属性后，Google map pin click不起作用。我无法点击它我想应用缩放属性 <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> <script> // This example displays a marker at the center of Austra

应用css3缩放属性后，Google map pin click不起作用。我无法点击它

我想应用缩放属性

        <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
            <script>
    // This example displays a marker at the center of Australia.
    // When the user clicks the marker, an info window opens.

    function initialize() {
        var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
        var mapOptions = {
            zoom: 4,
            center: myLatlng
        };

        var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

        var contentString = '<div id="content">'+
                '<div id="siteNotice">'+
                '</div>'+
                '<h1 id="firstHeading" class="firstHeading">Uluru</h1>'+
                '<div id="bodyContent">'+
                '<p><b>Uluru</b>,</p>'+
                '</div>'+
                '</div>';

        var infowindow = new google.maps.InfoWindow({
                content: contentString
        });

        var marker = new google.maps.Marker({
                position: myLatlng,
                map: map,
                title: 'Uluru (Ayers Rock)'
        });
        google.maps.event.addListener(marker, 'click', function() {
            infowindow.open(map,marker);
        });
    }

    google.maps.event.addDomListener(window, 'load', initialize);

            </script>
    <style>
    html, body, #map-canvas {
                    height: 100%;
                    margin: 0px;
                    padding: 0px
                }

    #map-canvas{
            zoom: 0.7;
            -moz-transform: scale(0.7);
            -webkit-transform: scale(0.7);

    }
    </style>
        <body>
            <div id="map-canvas"></div>
        </body>


//此示例在澳大利亚中部显示一个标记。
//当用户单击标记时，将打开一个信息窗口。
函数初始化（）{
var mylatng=new google.maps.LatLng（-25.363882131.044922）；
变量映射选项={
缩放：4，
中心：myLatlng
};
var map=new google.maps.map（document.getElementById（'map-canvas'），mapOptions）；
var contentString=''+
''+
''+
“乌鲁鲁”+
''+
“Uluru，”+
''+
'';
var infowindow=new google.maps.infowindow({
内容：contentString
});
var marker=new google.maps.marker({
职位：myLatlng，
地图：地图，
标题：“乌卢鲁（艾尔斯岩）”
});
google.maps.event.addListener（标记'click'，函数（）{
信息窗口。打开（地图、标记）；
});
}
google.maps.event.addDomListener（窗口“加载”，初始化）；
html，正文，#地图画布{
身高：100%；
边际：0px；
填充：0px
}
#地图画布{
缩放：0.7；
-moz变换：比例（0.7）；
-webkit变换：比例（0.7）；
}

有人能告诉我为什么在应用css3 zoom属性后没有得到指针。

请参考链接。

        <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
            <script>
    // This example displays a marker at the center of Australia.
    // When the user clicks the marker, an info window opens.

    function initialize() {
        var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
        var mapOptions = {
            zoom: 4,
            center: myLatlng
        };

        var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

        var contentString = '<div id="content">'+
                '<div id="siteNotice">'+
                '</div>'+
                '<h1 id="firstHeading" class="firstHeading">Uluru</h1>'+
                '<div id="bodyContent">'+
                '<p><b>Uluru</b>,</p>'+
                '</div>'+
                '</div>';

        var infowindow = new google.maps.InfoWindow({
                content: contentString
        });

        var marker = new google.maps.Marker({
                position: myLatlng,
                map: map,
                title: 'Uluru (Ayers Rock)'
        });
        google.maps.event.addListener(marker, 'click', function() {
            infowindow.open(map,marker);
        });
    }

    google.maps.event.addDomListener(window, 'load', initialize);

            </script>
    <style>
    html, body, #map-canvas {
                    height: 100%;
                    margin: 0px;
                    padding: 0px
                }

    #map-canvas{
            zoom: 0.7;
            -moz-transform: scale(0.7);
            -webkit-transform: scale(0.7);

    }
    </style>
        <body>
            <div id="map-canvas"></div>
        </body>

另外，请参考你的小提琴作品现在的例子

不要在%值中设置div高度。请使用像素值。或者使用带有像素的外部div。内部div高度，单位为%。它会起作用。

您能告诉我应用css3缩放属性有什么问题吗？这里需要什么缩放属性？。如果您想要地图缩放，那么使用map zoom属性。它还将增加div zooming属性。因此，确切的情况是，当用户缩放页面时，我希望调整地图的大小，使其看起来与取消缩放页面时完全相同（缩放级别1）。即使我更改了“地图缩放”属性，地图控件和其他字体也将处于缩放状态，这就是为什么我要使用css缩放或css缩放。