html-pdf: как обеспечить, чтобы изображение не занимало разрыв страницы - PullRequest
Новая
       27

html-pdf: как обеспечить, чтобы изображение не занимало разрыв страницы

2 голосов
/ 06 марта 2019

Я использую html-pdf для преобразования HTML в PDF. Для добавления графиков я использую Chart.js .

При создании PDF-файла Graph разбивается на две страницы, как показано на рисунке ниже.

Так я добавляю График. 

<canvas id="bar-chart" class="canvas-styles margin-top-20" 
 style="display: block; page-break-before: auto; page-break-after: auto; page-break-inside: avoid;">
</canvas>

enter image description here

Как я мог решить это?

1 Ответ

3 голосов
/ 06 марта 2019

Добавьте в свой css @print раздел для вашего div: 

@media print {
     div#canvasWrap { width: 2.4cm; }
  }

И добавьте div обтекания вокруг вашего холста: 

<div id="canvasWrap">
    <canvas id="bar-chart" class="canvas-styles"></canvas>
</div>

Добавьте любые стили, которые вам нужны, в оболочку...

...