-1

I have tried to load google map with my current location by using google maps api in JavaScript. I have tried this code by using JavaScript but it does not work. After I tried many ways I come to this code and it works perfect. This code will return Philadelphia as my current location but I want it to return my home address as my current location 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>

Can someone help me with that??

Tiger07
  • 15
  • 1
  • 3
  • 6

1 Answers1

0

Try this can help you:
https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-directions?hl=fr

don't put &key=IPutMyKeyHere if you don't have API KEY.

  • This help if I want places auto-complete but I want to get current location when map is loading – Tiger07 Apr 07 '16 at 12:59
  • and this : [https://developers.google.com/maps/documentation/javascript/examples/map-geolocation?hl=fr](https://developers.google.com/maps/documentation/javascript/examples/map-geolocation?hl=fr) – Tima Elad Apr 07 '16 at 15:36