Google maps in jsFiddle

I'm trying to implement Google maps in jsFiddle to ask another question, but I can't see the map:

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' +

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);, marker);



There you go

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


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. 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: (This is in addition to calling initialize of course)

Updated fiddle.


Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.