0

为什么我不能显示谷歌地图的第二个 DIV ID？我试图将我的 Map_canvas 更改为 Class 相同的结果我想在第二个 DIv map_canvas 中显示 Google 地图 Map 在我的 jQueryMobile 上运行所以我需要进入显示页面中的第二个 Div

这是我的代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Map</title>
    <script src="../../Scripts/jquery-1.8.2.js"></script>
    <script src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script src="http://www.google.com/jsapi"></script>
    <script>
        $(document).ready(function () {
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(success);
            } else {
                error('Geo Location is not supported');
            }
        });

        function success(position) {
            debugger;
            var coords = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);

            var options = {
                zoom: 17,
                center: coords,
                mapTypeControl: false,
                navigationControlOptions: {
                    style: google.maps.NavigationControlStyle.SMALL
                },
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            var map = new google.maps.Map(document.getElementById("my_maps").children[0], options);

            var marker = new google.maps.Marker({
                position: coords,
                map: map,
                title: "You are here!"
            });
        }
    </script>

    <style>
        html {
            height: 100%;
            overflow: hidden;
        }

        body {
            margin: 0;
            padding: 0;
            height: 100%;
        }

        #map_canvas {
            height: 100%;
        }
    </style>
</head>
<body>
    <div id="my_maps">
        <div id="map_canvas"></div>
    </div>
</body>
</html>
4

1 回答 1

0

我认为问题不在于您如何选择 DOM 元素。
尝试为您的包装 div 指定width和height（并且 map-div 应该适合它）。

<div id="my_maps" style="width:100%; height:500px;">
    <div id="map_canvas" style="width:100%; height:100%;"></div>
</div>

.children[]而且，虽然与父节点一起使用没有问题；这应该更快：

document.getElementById('map_canvas');
于 2013-01-29T23:15:41.397 回答