Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie

[JavaScript] Google Maps API

Options
  • 14-11-2013 9:14pm
    #1
    LostBoy101
    Registered Users 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