Google maps in jsFiddle

问题

I'm trying to implement Google maps in jsFiddle to ask another question, but I can't see the map: http://jsfiddle.net/hashie5/aknYP/

I've added the gmap script in the resources

How can I show the map in jsFiddle?

function initialize() {
var myLatlng = new google.maps.LatLng(50.965049,5.484231);
var myOptions = {
  zoom: 14,
  center: myLatlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
}

var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

var contentString = 
    '<div id="infowindow">' +
    'Galaconcert<br />' +
    'Jaarbeurslaan 2-6<br />' +
    '3690 Genk' +
    '</div>'
;

var infowindow = new google.maps.InfoWindow();

var marker = new google.maps.Marker({
    position: myLatlng,
    map: map,
    title: 'Galaconcert'
});
google.maps.event.addListener(marker, 'click', function() {
    infowindow.setContent(contentString);
    infowindow.open(map, marker);
});
}

回答1:

There you go http://jsfiddle.net/aknYP/4/

You were never calling initialize() nor loading the JS Google Maps API

回答2:

As explained here under "Add Resources" in a red box:

Warning: jsFiddle is recognizing the type of the resource by the extension. If you want to use a dynamic resource please add a dummy GET variable i.e. http://example.com/download/js/dynamically.js?somevar=somevalue&dummy=.js. This will trick jsFiddle to recognize it as JavaScript resource.

So to make jsFiddle recognize the Google Maps API (which indeed does not have .js extension) you need to add this as the resource: http://maps.googleapis.com/maps/api/js?sensor=false&dummy=.js (This is in addition to calling initialize of course)

Updated fiddle.

来源：https://stackoverflow.com/questions/13681917/google-maps-in-jsfiddle

标签

javascript

google-maps

jsfiddle