• Tuesday , 20 November 2018

Google Map Api Javascript Tutorial

Code Canyon

in this video you can learn basic useage of google map javascript api . you can add map in your project .get latitude / longitude by clicking at any position in map . add marker in map . change marker icon remove marker .

Original source

3d Ocean

Related Posts


  1. Jorge Luis Ricra Alcantara
    December 12, 2017 at 13:10

    thanks for this video

  2. kyle XYZ
    December 12, 2017 at 13:10

    All is perfectly working man..can I ask of what's the code when, I only wanted a marker on my location. because I kinda want to make this as my contact section background and a marker on my location.

    and can you make a video where you can custom google map api design? I've seen some websites with there google map well designed..


  3. kyle XYZ
    December 12, 2017 at 13:10

    Mine is not working..why is that..??
    Please help me..

    <!DOCTYPE html>
    <title>Google map</title>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="css/reset.css">
    <style type="text/css">

    height: 100%;
    width: 100%;

    background-color: #efefef;
    border:4px solid #999;
    margin:100px auto;
    height: 400px;
    width: 60%;
    height: 100%;
    width: 100%;


    <div class="map-container">
    <div id="google_map"></div>

    <!– JS HERE –>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

    <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDyA6p871V6QE4PC62pp5hoGfp8gZ0gvv0&callback=initMap"></script>

    <script type="text/javascript">
    function initMAp() {
    var map = new google.maps.Map(document.getElementById('google_map'), {
    zoom : 8,
    center : { lat : 14.5568740, lng : 121.1114870 }

Leave A Comment

You must be logged in to post a comment.