Question

i’m checking out some newbie Google Maps API tutorial code.

They have an example that says how to dynamically add some script to a page, once the page has finished loading. I’m wondering if this code can be made shorter if I use JQuery?

here’s the code…

function initialize() {
  var myLatlng = new google.maps.LatLng(-34.397, 150.644);
  var myOptions = {
    zoom: 8,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

function loadScript() {
  var script = document.createElement("script");
  script.type = "text/javascript";
  script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=initialize";
  document.body.appendChild(script);
}

window.onload = loadScript;

possible?

Answer 1

Sure you can change a few calls to be jQuery, but I don’t think you will severely shorten anything here.

It would look something like this in jQuery:

function initialize() {
  var myLatlng = new google.maps.LatLng(-34.397, 150.644);
  var myOptions = {
    zoom: 8,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map($("#map_canvas").get(0), myOptions);
}

$(document).ready(
  function{ 
    $.getScript('http://maps.google.com/maps/api/js?sensor=false&callback=initialize');
  });