CODEWITHSUNDEEP
javascriptjquerygoogle-mapsgoogle-maps-api-3
Aravinth E
Aravinth E

Reputation: 491

Location marker on map jquery

I used location marker on my address. but can't work properly for map and location marker

HTML code.

<section class="contact-map2" id="contact-map2">
</section>

Jquery code.

<!-- Jquery -->
<script src="js/jquery-3.1.1-min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyAT4sxB6QJ6yqBA7bve0j6wLYSHeF2NKs0&amp;sensor=false&amp;libraries=places"></script>
<script type="text/javascript">
    google.maps.event.addDomListener(window, 'load', init);
    function init() {
        mapInit(11.01392086,76.96254899,"contact-map2","images/pin-house-green.png", true);
    }
</script>

please help me for solve this problem.

Upvotes: 0

Views: 2114

Answers (1)

Mayank Pandeyz
Mayank Pandeyz

Reputation: 26288

To add a location marker use this code:

<script>
  function initMap() {
    var uluru = {lat: -25.363, lng: 131.044};
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 4,
      center: uluru
      // You can set more attributes value here like map marker icon etc
    });
    var marker = new google.maps.Marker({
      position: uluru,
      map: map
    });
  }
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"></script>

<div id="map"></div>

here callback=initMap will call the initMap() on page load and render the map with location marker.

Reference

Upvotes: 2

Related Questions