Advertisement
Help Keep Boards Alive. Support us by going ad free today. See here: https://subscriptions.boards.ie/.
If we do not hit our goal we will be forced to close the site.

Current status: https://keepboardsalive.com/

Annual subs are best for most impact. If you are still undecided on going Ad Free - you can also donate using the Paypal Donate option. All contribution helps. Thank you.
https://www.boards.ie/group/1878-subscribers-forum

Private Group for paid up members of Boards.ie. Join the club.

[JavaScript] Google Maps API

  • 14-11-2013 08:14PM
    #1
    Registered Users, Registered Users 2 Posts: 2,369 ✭✭✭


    Hey there I just want to add a simple Google Maps API marker and I've added in the code from the google's developers website and alter it for my website. However it does seem to display the map at all in my website and I'm fairly new to this.

    This is my code in a JavaScript file
    /* Google Maps */

    function initialize() {
    var myLatlng = new google.maps.Latlng(-25.363882,131.044922);
    var mapOptions = {

    zoom: 15,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    var marker = new google.maps.Marker({
    position: myLatlng,
    map: map,
    title: 'Nolans Mercedes Benz'
    });

    }
    google.maps.event.addDomListener(window, 'load', initialize);

    HTML code
    <html>
    <head>
    <title></title>

    <!-- Google Maps -->

    <link href="css/GoogleMaps.css" rel="stylesheet" type="text/css" />

    <!-- API -->
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script&gt;

    <!-- JavaScript for Google Maps -->
    <script src="JavaScript/GoogleMaps.js"></script>
    </head>

    <body>
    <!-- Main Body Google Map -->

    <div id="body">

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


    </div>
    </body>

    CSS
    #map-canvas {
    width: 750px;
    height: 430px;
    border-radius: 10px;

    }


Comments

Advertisement