JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCxrbE0MBmDRGnnPjyIx5RunUq_bEMxY3k&sensor=true"></script>

<div class="map_canvas">
    <div class="map_area" data-showcontrols="true" data-lat="26.84651" data-lng="80.94668" data-zoom="7"></div>           
</div>

CSS

.map_canvas { border: 10px solid #d2d828; position:relative; }
.map_area { 
    height: 400px; width:100%; 
    background: #fff;
    position: absolute;
    -webkit-transform: rotate(75deg);
    -moz-transform: rotate(75deg);
    transform: rotate(75deg);
    top: 10px;
    right: -120px;
}

JavaScript

$(function() {
		$('div.map_area').each(function() {
			var data = $(this).data(),
				options = {
					center: new google.maps.LatLng(data.lat, data.lng),
					disableDefaultUI: data.showcontrols || false,
					zoom: data.zoom || 10,
					mapTypeId: google.maps.MapTypeId.ROADMAP,
					//addr: data.address
				};
			
			var map = new google.maps.Map(this, options);
		});
		
	});