JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maps.googleapis.com/maps/api/js?libraries=places&amp;sensor=false"></script>
<script src="https://hpneo.github.io/gmaps/gmaps.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="maps"></div>

CSS

#maps {
  width: 400px;
  height: 400px;
}

JavaScript

$(document).ready(function() {
	adresses = [
    'bordeeaux, france',
    'toulouse, france',
    'madrid, espagne',
    'ankara, turquie'
  ]
  function markers(i) {
     GMaps.geocode({
        address: adresses[i],
        callback: function(results, status) {
          if (status == 'OK') {
            var result = results[0].geometry.location;
            var latitude = result.lat();
            var longitude = result.lng();
            map.addMarker({
              lat: latitude,
              lng: longitude
            });
          }
        }
      });
  }
      
  latitude = 46.22764;
  longitude = 2.21375;
  map = new GMaps({
  	el: '#maps',
  	lat: latitude,
  	lng: longitude,
  	zoomControl: false,
  	panControl: false
  });
  	map.setCenter(latitude, longitude);
  	for (i=0;i<adresses.length;i++) {
  		markers(i);
  	}
  	map.fitZoom();
});