Google Maps JSFIDDLE Markers

I need 5 markers to show up on the map and only one is, link to jsfiddle: https://jsfiddle.net/MarnieMaclean/u04cg62p/

// Initialize and add the map

function initMap() {
//The location of Aberdeen
var aberdeen = {lat: 57.155988, lng: -2.095139};
var city1 = ‘Aberdeen\n’+‘lat:57.155988, lng: -2.095139’; // The map, centered at Aberdeen
var map = new google.maps.Map(

document.getElementById(‘map’), {zoom: 4, center: aberdeen});
// The marker, positioned at Aberdeen
var marker1 = new google.maps.Marker({position: aberdeen, map: map,

id: c1, title: city1});

//The location of Inverness
var inverness = {lat: 57.480819, lng: -4.224250};
var city2 = ‘Inverness\n’+‘lat: 57.480819, lng: -4.224250’; // The map, centered at Inverness
var map = new google.maps.Map(

document.getElementById(‘map’), {zoom: 4, center: inverness});
// The marker, positioned at Inverness
var marker2 = new google.maps.Marker({position: inverness, map: map,

id:c2, title: city2});

1

//The location of Dundee
var dundee = {lat: 56.467546, lng: -2.969593}; var city3 = dundee;
// The map, centered at Dundee
var map = new google.maps.Map(

document.getElementById(‘map’), {zoom: 4, center: dundee});
// The marker, positioned at Dundee
var marker3 = new google.maps.Marker({position: dundee, map: map});

//The location of Glasgow
var glasgow = {lat: 55.875362, lng: -4.250252};
var city4 = ‘Glasgow\n’+‘lat: 55.875362, lng: -4.250252’; // The map, centered at Glasgow
var map = new google.maps.Map(

document.getElementById(‘map’), {zoom: 4, center: glasgow});
// The marker, positioned at Glasgow
var marker4 = new google.maps.Marker({position: glasgow, map: map,

id:c4, title: city4});

//The location of Edinburgh
var edinburgh = {lat: 55.959425, lng: -3.189161};
var city5 = ‘Edinburgh\n’+‘lat: 55.959425, lng: -3.189161’;

var map = new google.maps.Map( document.getElementById(‘map’), {zoom: 4, center: edinburgh});

// The marker, positioned at Edinburgh
var marker5 = new google.maps.Marker({position: edinburgh, map: map,
id: c5, title: city5}); }

@MarnieCMaclean97 Hi, it’s because you are re-declaring the map for every city.
Keep the var map = new google.maps.Map(...) at the beginning and remove the declarations for the map of the other cities, like this:

// Initialize and add the map
  function initMap() {
  var inverness = {lat: 57.480819, lng: -4.224250};
  var city1 = {position: inverness};
  // The map, centered at Inverness
  var map = new google.maps.Map(
      document.getElementById('map'), {zoom: 4, center: inverness});
  // The marker, positioned at Inverness
  var marker1 = new google.maps.Marker({position: inverness, map: map});

  var dundee = {lat: 56.467546, lng: -2.969593};
  var city2 = {position: dundee};
  // The marker, positioned at Dundee
  var marker2 = new google.maps.Marker({position: dundee, map: map});

  var glasgow = {lat: 55.875362, lng: -4.250252};
  var city3 = {position: glasgow};ì
  // The marker, positioned at Glasgow
  var marker3 = new google.maps.Marker({position: glasgow, map: map});
  
    var edinburgh = {lat: 55.959425, lng: -3.189161};
    var city4 = {position: edinburgh};
    // The marker, positioned at Edinburgh
  var marker4 = new google.maps.Marker({position: edinburgh, map: map}); 
    
  var aberdeen = {lat: 57.155988, lng: -2.095139};
  var city5 = {position: aberdeen};
  // The marker, positioned at Aberdeen
  var marker5 = new google.maps.Marker({position: aberdeen, map: map});
}

Happy coding!