繁体   English   中英

如何使用 google map api 加载带有当前地址的地图

[英]How can I load map with my current address by using google map api

我试图通过在 JavaScript 中使用谷歌地图 api 加载带有我当前位置的谷歌地图。 我已经使用 JavaScript 尝试过这段代码,但它不起作用。 在我尝试了很多方法之后,我来到了这段代码,它工作得很好。 此代码将返回费城作为我的当前位置,但我希望它返回我的家庭地址作为我的当前位置 My Google Map App

    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=true&libraries=places&key=YOUR_API">
    </script>

    <script>
        var x = document.getElementById("map");
        var map;
        function getLocation()
        {
            if (navigator.geolocation) 
            {
                navigator.geolocation.getCurrentPosition(showPosition);
            } 
            else 
            { 
                x.innerHTML = "Geolocation is not supported by this browser.";
            }
        }

        function showPosition(position) 
        {
            var latitude = position.coords.latitude;
            var longitude = position.coords.longitude;
            var center = new google.maps.LatLng(latitude,longitude);
            var myOptions = {
                center: center,
                zoom: 13,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            map = new google.maps.Map(document.getElementById('map'), myOptions);

            // Create a marker and set its position.
            var marker = new google.maps.Marker({
                map: map,
                position: center,
                title: 'You are here'
            }); 
        }

        google.maps.event.addDomListener(window, 'load', initialize);
    </script>

    <script type="text/javascript">
        function comple() 
        {
                var org = document.getElementById('org');
                var des = document.getElementById('des');
                var autocomplete = new google.maps.places.Autocomplete(org);
                var autocomplete2 = new google.maps.places.Autocomplete(des);
        }
        google.maps.event.addDomListener(window, 'load', comple);
    </script>

</head>
<body onload="getLocation()">
<p><h1>Car Direction Finder</h1></p>
<br>
<form name="form1" id="form1" action="Direction.php" method="post">
<p>
Source:
<input type="text" name="org" id="org" placeholder="Enter Original Source" size="50" autocomplete="on">
Destination:
<input type="text" name="des" id="des" placeholder="Enter Destination Source" size="50" autocomplete="on">
<label for="des"></label>
<input type="submit" value="GO"/>
<br>
</form>
<div align="center">
<table border="2" width="750" height="550" align="center">
    <tr>
        <td id="map"></td>
    </tr>
</table>
</div>
</body>
</html>

有人可以帮我吗??

试试这个可以帮助你:
https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-directions?hl=fr

如果您没有 API KEY,请不要将 &key=IPutMyKeyHere 放在这里。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM