print_gmap.js

var printMap = function(map) {
  map.setOptions({
    mapTypeControl: false,
    zoomControl: false,
    streetViewControl: false,
    panControl: false
  });

  var popUpAndPrint = function() {
    dataUrl = [];

    $('#map-canvas canvas').filter(function() {
      dataUrl.push(this.toDataURL("image/png"));
    })

    var container = document.getElementById('map-canvas');
    var clone = container.clone();

    var width = container.clientWidth
    var height = container.clientHeight

    $(clone).find('canvas').each(function(i, item) {
      $(item).replaceWith(
        $('<img>')
          .attr('src', dataUrl[i]))
          .css('position', 'absolute')
          .css('left', '0')
          .css('top', '0')
          .css('width', width + 'px')
          .css('height', height + 'px');
    });

    var printWindow = window.open('', 'PrintMap',
      'width=' + width + ',height=' + height);
    printWindow.document.writeln($(clone).html());
    printWindow.document.close();
    printWindow.focus();
    printWindow.print();
    printWindow.close();

    map.setOptions({
      mapTypeControl: true,
      zoomControl: true,
      streetViewControl: true,
      panControl: true
    });
  };

  setTimeout(popUpAndPrint, 500);
};

I think you mean

clone = $(container).clone()?

i think makes better with this line
$(".gmnoprint", clone).remove();

Thanks for this! In my case, I created a div to contain the map plus directions and used that in place of 'map-canvas' above. It opens without all of the extra garbage and is perfect. Thanks again!

Is there any demo or example plunkr or something? THanks.

any demo?

dataUrl.push(this.toDataURL("image/png"));
is throwing SecurityError: The operation is insecure. any fix for that?