Я не могу напечатать изображение 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, поэтому понятия не имею, почему это происходит. Почему размер экрана влияет на печать.