2015-06-11 3 views
0

Я использую "angular-chart.js"Как напечатать угловую диаграмму

и распечатать эту карту. Мой код,

<html> 
<head>Chart</head> 
<body> 
    <div class="row"><b>Patient Report</b> 
     <div> 
      <canvas id="line" class="chart chart-line" data="agedata" colours="colours" 
       labels="labels" legend="true" series="series"click="onClick"></canvas> 
     </div> 
    </div> 
    <div class="row"> 
     <a href="javascript:window.print()" class="btn btn-success">Print</a> 
    </div> 
</body> 

Но это ничего не печатает. Может ли кто-нибудь предложить мне методы печати диаграммы?

+0

Введите образец кода в отформатированный состоянии, это означает: не стесняйтесь добавлять разрывы строк. И проверьте свои пробелы и закрывающие кавычки. Если ваш код подобен показанному выше, некоторые из них отсутствуют. (посмотрите около «click =» и «class =») – Marged

+0

Отличным местом для начала будет просмотр раздела [Начало работы] (http://jtblin.github.io/angular-chart.js/) углового.chart.js; вам не хватает всех включений, и ничто в вашем примере указывает, что вы используете Angular вообще. –

ответ

0

Вы можете использовать toDataURL(), чтобы сделать холст в изображение (и вы можете использовать средства массовой информации конкретных CSS, чтобы скрыть холст и подкачку в IMG с СРК в качестве URL данных при печати)

Не забудьте дождитесь окончания анимации перед генерированием URI данных или вы получите пустую картинку.

0

Chart.js полагается на холст HTML5 для рендеринга своих диаграмм, однако объекты canvas не могут быть распечатаны браузерами.
Решение обходить это ограничение состоит в том, чтобы преобразовать холст в изображение при печати, как описано в this post.

Приветствия,

Смежные вопросы