Info windows

by roberts gailitis

HTML

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<h1 style="text-align: center"> Port cloud </h1>
<div id="map" id="klu"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBjSrjlrnKALLEUCNzuPNT92W26ZkVhiIw&callback=initMap">
</script>

<p> Made by Infomaritime</p>

CSS

/* Always set the map height explicitly to define the size of the div
 * element that contains the map. */
#map {
  height: 90%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

JavaScript

// there is no need
var markerArray = [];
var infowindowArray =[];


var ports =[
['Rotterdam' , 51.9496 , 4.1453 ,'R' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Rotterdam.png'],
['Antwerp' , 51.2411 , 4.4073 ,'A' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Antwerp.png'],
['Hamburg' , 53.50943 , 9.96548 ,'H' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Hamburg.png'],
['Marseille' , 43.29695 , 5.38107 ,'M' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Marseille.png'],
['Riga' , 56.9593 , 24.0947 ,'R' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Riga.png'],
['Amsterdam' , 52.412 , 4.8079 ,'A' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Amsterdam.png'],
['Algeciras' , 36.136 , -5.435 ,'A' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Algeciras.png'],
['Botas' , 36.8725 , 35.9363 ,'B' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Botas.png'],
['Izmit' , 40.75439 , 29.86253 ,'I' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Izmit.png'],
['Le Havre' , 49.48509 , 0.11665 ,'L' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Le-Havre.png'],
['Valencia' , 39.44809 , -0.31693 ,'V' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Valencia.png'],
['Immingham' , 53.6277 , -0.1918 ,'I' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Immingham.png'],
['Bremerhaven' , 53.53958 , 8.58094 ,'B' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Bremerhaven.png'],
['London' , 51.5 , 0.05 ,'L' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-London.png'],
['Aliaga' , 38.8122 , 26.94318 ,'A' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Aliaga.png'],
['Trieste' , 45.647 , 13.75522 ,'T' , 'http://infomaritime.eu/wp-content/uploads/2018/07/Port-of-Trieste.png'],
['Sines' , 37.9526 , -8.88481 ,'S' ,...