Google Maps API
HTML
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script src="https://maps.google.com/maps/api/js?sensor=false"></script>
<div class="ui-widget-header ui-corner-top form_pad">
<h2>View Cryptid Sightings</h2>
</div>
<div class="ui-widget-content form_pad">
<div id="map_canvas"></div>
</div>
CSS
#map_canvas {
width: 400px;
height: 400px;
}
JavaScript
$(document).ready(function() {
var map;
function initialize() {
var lat = 45.519098;
var lng = -122.672138;
var latlng = new google.maps.LatLng(lat, lng);
var mapOpts = {
zoom: 13,
center: latlng,
mapTypeId: google.maps.MapTypeId.HYBRID
};
map = new google.maps.Map(document.getElementById("map_canvas"), mapOpts);
}
initialize();
});