如何使用谷歌地图api加载带有当前地址的地图

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

本文关键字：地址地图何使用谷歌地图 api 加载更新时间：2024-01-28

我曾尝试在JavaScript中使用谷歌地图api加载带有当前位置的谷歌地图。我使用JavaScript尝试过这段代码，但它不起作用。在我尝试了很多方法之后，我得到了这个代码，它非常完美。此代码将费城返回为我的当前位置，但我希望它将我的家庭地址返回为我当前的位置我的谷歌地图应用程序

    <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

不要把&key=IPutMyKeyHere如果您没有API密钥。