How to take screenshot of googlemap from web page using PhantomJs?

My Requirement is to take screen shot of Google Map of web page.I am drawing Markers and Polyline dynamically on Google Map.I am using PhantomJS for taking screen shot.But screen shot is not capturing of complete Google Map which is displaying on web page.

Html and javascript for loading and display google map
----------
     <script>
            function initMap() {
                    var mapOptions = {
                        zoom: 15,
                        center: new google.maps.LatLng(28.5354383, 77.26393259999998)
                    };
                    var map = new google.maps.Map(document.getElementById('map'), mapOptions);
                    var project_id = $('#project').data('url')
                    var latt = substation[0]
                    var lngg = substation[1]
                    var marker = new google.maps.Marker({
                        position: new google.maps.LatLng(latt, lngg),
                        title: new google.maps.LatLng(latt, lngg).toUrlValue(6),
                        map: map,
                        draggable: true,
                        label: {
                            color: 'black',
                            fontWeight: 'bold',
                            text: "Sub-Station",
                        },
                        icon: {
                            labelOrigin: new google.maps.Point(4, 25),
                            url: '/assets/sub_station.png',
                        }
                    });
                    google.maps.event.addListener(marker, "dragend", function(event) {
                        $.getScript("/update_pole.js?project_id=" + project_id + "&Type=SS" + "&new_cordinated=" + event.latLng.toString().slice(1, -1), function(data) {});
                    });
                    var lattt = feeder[0]
                    var lnggg = feeder[1]
                    var marker = new google.maps.Marker({
                        position: new google.maps.LatLng(lattt, lnggg),
                        title: new google.maps.LatLng(lattt, lnggg).toUrlValue(6),
                        map: map,
                        draggable: true,
                        label: {
                            color: 'black',
                            fontWeight: 'bold',
                            text: "Feeder",
                        },
                        icon: {
                            labelOrigin: new google.maps.Point(4, 25),
                            url: '/assets/ptw.png',
                        }
                    });

PhantomJs for capture screenshot

var page = require('webpage').create();
  page.open('http://ift.tt/2marneo', function() {
  page.viewportSize = { width: 1440, height: 900 };
  var clipRect = page.evaluate(function(){
    return document.querySelector("div#map").getBoundingClientRect();
  });
  page.render('github.png');
  phantom.exit();
});

Expected Screen Shot

Currently Coming Screen Shot