Google maps in jsFiddle

Question

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

You are never calling `initialize()` – David Hellsing Dec 03 '12 at 11:07 — David Hellsing, Dec 03 '12 at 11:07

score 11 · Answer 1 · answered Dec 03 '12 at 11:22

11

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.

answered Dec 03 '12 at 11:22

Shadow The GPT Wizard

66,030
26
140
208

True, it was obvious jsfiddle won't store all the scripts forever however my answer contains no code change just change in an included resource. – Shadow The GPT Wizard Apr 24 '13 at 06:27
2

@rbp turns out the OP here manually deleted his fiddles, it's not jsFiddle fault. See [this comment](http://stackoverflow.com/questions/8171371/how-long-does-jsfiddle-host-your-code-for/8191278?noredirect=1#comment23144599_8191278) by jsFiddle creator. – Shadow The GPT Wizard Apr 24 '13 at 10:24

score 2 · Accepted Answer · answered Dec 03 '12 at 11:10

2

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

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

answered Dec 03 '12 at 11:10

davids

6,259
3
29
50

+1 , it seems a bug in jsfiddle that `http://maps.google.com/maps/api/js?sensor=false` don't work when added on **Manage Resources** sidepane but works when setting it in a – Nelson Dec 03 '12 at 11:17

Google maps in jsFiddle

2 Answers2

Linked