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);
});
}

Answers:

Answer

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

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

Answer

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.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.