Невозможно установить svg для печати в браузере в ландшафтном режиме - PullRequest
2 голосов
/ 20 июня 2019

Я не могу напечатать изображение SVG для формата А4 в альбомной ориентации. CSS, который я использую:

@media print{
  @page{
    size: landscape;
    max-height: 100%;
    max-width: 100%;
  }
  svg{
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    display: block;
    overflow: visible;
    transform: scale(.8,.7);
    transform-origin: top center;
  }
}

Также CSS, чтобы скрыть все другие элементы, кроме элементов в теле (Основной контент)

Макет страницы, который ему нравится:

+------------+---------+
|        HEADER        |
+------------+---------+
|     X|               |
|      |               |
| SIDE | MAIN/BODY     |
| PANEL|               |
|      |               |
+------------+---------+

Этот SVG создан путем построения графиков для библиотеки. Вышеприведенный CSS отлично работает, если боковая панель открыта, но если я закрою боковую панель, SVG изменяет размер, чтобы закрыть это пространство. Теперь, если попытаться напечатать, в предварительном просмотре содержимое SVG отображается не полностью, большая часть обрезается с левой стороны ... даже если я вижу пустое пространство, но диаграмма не покрывает это пространство. Общий размер диаграммы остается неизменным независимо от того, открыта или закрыта боковая панель.

Я скрываю все остальные HTML-элементы с помощью CSS при печати. И этот SVG, который я печатаю в теле и создается путем построения графиков библиотеки.

Кроме того, это также нарушается, если вы пытаетесь печатать с экрана большого размера. Я не уверен, как справиться с этим. Нужно ли писать CSS для всех размеров экрана и соответственно изменять масштабирование? Я мало работаю с CSS, поэтому понятия не имею, почему это происходит. Почему размер экрана влияет на печать.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...