Как просмотреть Карты Google в режиме «печать»?

Question

Я использую Google Maps API v2, и я хотел бы иметь возможность печатать карту так же, как Google на своей странице Карт.

Вы можете нажать на маленький значок принтера, и онсоздает новое всплывающее окно с той же картой, но все непечатаемые элементы (например, элементы управления) удаляются.Я знаю, что они используют @media print для достижения этого эффекта, когда вы нажимаете «Предварительный просмотр» или «Печать» в навигаторе.Тем не менее, всплывающее окно не находится в режиме печати. ​​

Есть ли какой-нибудь способ сделать магический трюк, который они делают, например, установить текущий тип носителя для «печати»?Или они обманывают и настраивают пользовательский чит в стиле CSS?

У меня есть плагин Silverlight и карта Google на одной странице, и я хочу иметь возможность создать всплывающее окно, содержащее только карту, готовуюпечать (как это делает Google).

Благодаря http://abcoder.com/google/google-map-api/print-button-for-google-map-api/ Я знаю, как получить контент HTML, но я могу получить контент только со всеми элементами управления и т. д. (чего я не делаюхочу).

Любая помощь будет оценена.

Answer 1

Google карты помещают класс gmnoprint на все элементы, которые они не хотят печатать .. поэтому, установив для этого параметра значение display:none в файле печати CSS или всплывающем окне, они будут скрыты ..

.gmnoprint{
  display:none;
}

Конечно, это скроет все, что Google считает не предназначенным для печати. ​​Если вы хотите выбрать другие элементы, вам придется как-то разобрать их HTML-код: (

Answer 2

У меня возникла та же проблема с пользовательским наложением изображения карты, добавленным через kml.Heads-up Габи о классе gmnoprint был ключом.В моем случае div с примененным классом gmnoprint был прямым родителем моего элемента img, который исчезал.Я в основном создал «сделать наложение ссылки для печати»:

    $("#printable-map").click(function() {
        if($(this).text() == "Include overlay when printing") {
            $(this).text("Exclude overlay when printing");
            $("[src$=blah.png]").parent().removeClass("gmnoprint");
        } else {
            $(this).text("Include overlay when printing");
            $("[src$=blah.png]").parent().addClass("gmnoprint");
        }
    });

Протестировано и работает в Safari, FF и Chrome.

Answer 3

Еще один полезный подход к печати карт Google заключается в использовании API статических карт Google . Вы можете генерировать статическое изображение на основе ряда параметров отображения (местоположение, уровень масштабирования, размер, маркеры и т. Д.) И включать это изображение на страницу просмотра для печати. ​​