dual google map

<html>
<head>
<style>
.mapzm {
    float: left;
    height: 217px;
    margin: 8px 0 0 8px;
    padding: 0;
    width: 223px;
}
.mapsmpl {
    float: left;
    height: 310px;
    margin: 8px 0 10px 15px;
    padding: 0;
    width: 699px;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3&sensor=false"></script>
<script>
    var geocoder;
    var latLng = new google.maps.LatLng(-33.873651,151.2068896);
    var map;
    var marker;
    function initialize()
    {
    //-------------------------Left side Map ( mini Map )----------------------------------
            var myOptions = {
                    zoom :5,
                    maxZoom :11, // upto 5 KM
                    minZoom :3,
                    center: latLng,
                    disableDefaultUI: true,
                    zoomControl: true,
                    scaleControl: true,
                    scrollwheel: false,
                    draggableCursor: 'crosshair',
                    draggingCursor : 'crosshair',
                    mapTypeId: google.maps.MapTypeId.ROADMAP
            }
            var minimap = new google.maps.Map(document.getElementById("minimap"),myOptions);
            var marker = new google.maps.Marker({
                    map: minimap,
                    position:latLng,
                    draggable:true
            });
            google.maps.event.addListener(minimap, 'dragend', function(event) {
                     placeMarker(minimap,marker);
           });

     //----------------------------- Right side Map--------------------------------------//
             var rightMapOpt = {
                zoom :8,
                panControl: false,
                zoomControl: true,
                scaleControl: true,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            map = new google.maps.Map(document.getElementById("map_canvas"),rightMapOpt);

            var markerBounds = new google.maps.LatLngBounds();


    }
     google.maps.event.addDomListener(window, 'load', initialize);
     function placeMarker(minimap,location) {
            var latLng = location.getPosition(); // returns LatLng object
                     console.log('dragends now'+latLng);
                     minimap.setCenter(latLng); // setCenter takes a LatLng object
                     map.setCenter(minimap.getCenter());
                     console.log('Here'+location);
                     var c = minimap.getCenter();
           }
</script>
</head>
<body>
 <div class="mapzm">
       <div id="minimap" style="width: 225px; height: 210px;"></div>
 </div>
 <div class="mapsmpl">
        <div id="map_canvas" style="width: 700px; height: 310px;"></div>
 </div>
</body>
<html>


</script>