JSFiddle - React, Tailwind, and code Playground

by varid007

HTML

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCHAd5EtGvzkpyMJ3C_qNEb81ujYCB7rEA&sensor=false"></script>
<h1>Peta Tugu Muda</h1>

<div id="map"></div>


Visit <a href="pc-mode.blogspot.com">pc-mode.blogspot.com</a>

CSS

#map{
    height: 300px;
    width: 500px;
}

JavaScript

//---------------------memanggill map--------------------
var id = "map"; //id pada html di atas
var myLatLng = new google.maps.LatLng(-6.984021,110.409508);//latitude dari google map

var myZoom = 15;
var image = ''; //icon lokasi 
var markerTitle = "Tugu Muda"; //teks yang akan muncul ketika di atas icon


function initializeMap(){
	var mapOptions = {
      center: myLatLng,
      zoom: myZoom,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById(id),
        mapOptions);

    var marker = new google.maps.Marker({
      position: myLatLng,
      map: map,
      title: markerTitle,
      icon: image
	});
}
//--------------------memanggil fungsi di atas--------
initializeMap();