2016-05-19 4 views
1

В моем проекте Laravel 5 я использую Lavacharts (приведенный в Google Charts) для отображения графиков и обертки dompdf, laravel-dompdf, для создания файлов PDF.Можно ли экспортировать Google Chart с помощью dompdf?

Можно ли экспортировать такие диаграммы с помощью dompdf, и если да, то как это можно достичь?

Предположительно, мне нужно сначала сохранить диаграмму в качестве изображения, но это не вариант, так как сохранение изображения выполняется с помощью Javascript и для создания PDF-файла вся работа выполняется на бэкэнд (PHP).

+0

Являются ли эти данные приватными? Если нет, выведите диаграмму по общедоступному маршруту и ​​используйте wkhtmltopdf или соответствующую оболочку, такую ​​как https://github.com/barryvdh/laravel-snappy. Если данные являются конфиденциальными, я бы использовал один и тот же метод, но настроил промежуточное ПО/фильтр маршрута, чтобы ограничить доступ к определенному ip (например, вашему серверу) или, если вы используете общий сервер, тогда требуется конкретный (длинный, неопознанный) токен как часть запроса – Steve

ответ

1

Dompdf не может обрабатывать содержимое на основе JavaScript на странице. У вас есть два варианта:

  1. Предварительный просмотр диаграмм в браузере и отправка версии изображения на сервер для рендеринга.
  2. Используйте обезглавленное браузер (например, PhantomJS), чтобы сделать ваш HTML (с JavaScript) в формате PDF

Я не много говорить на второй вариант, но на первом ...

API графиков Google может generate a PNG version вашего графика. На SO есть много сообщений о том, как получить PNG для вашего кода PHP (search it).

Что-то вроде следующего может работать:

<script type="text/javascript"> 
google.charts.load("current", {packages:['corechart']}); 
google.charts.setOnLoadCallback(drawChart); 
function drawChart() { 

    var data = google.visualization.arrayToDataTable([ 
    ['Element', 'Density', { role: 'style' }], 
    ['Copper', 8.94, '#b87333', ], 
    ['Silver', 10.49, 'silver'], 
    ['Gold', 19.30, 'gold'], 
    ['Platinum', 21.45, 'color: #e5e4e2' ] 
    ]); 

    var options = { 
    title: "Density of Precious Metals, in g/cm^3", 
    bar: {groupWidth: '95%'}, 
    legend: 'none', 
    }; 

    var chart_div = document.getElementById('chart_div'); 
    var chart_input = document.getElementById('chart_input'); 
    var chart = new google.visualization.ColumnChart(chart_div); 

    // Wait for the chart to finish drawing before calling the getImageURI() method. 
    google.visualization.events.addListener(chart, 'ready', function() { 
    chart_div.innerHTML = '<img src="' + chart.getImageURI() + '">'; 
    chart_input.value = chart.getImageURI(); 
    }); 

    chart.draw(data, options); 

} 
</script> 

<div id='chart_div'></div> 

<form method="post" action="print_chart.php"> 
<input type="hidden" name="chartImg" id="chartImg"> 
<button type="submit">print</button> 
</form> 

Google Диаграмма делает PNG с помощью данных URI, который поддерживает DOMPDF. Как только у вас есть PNG на стороне сервера, вы можете просто вставить его в тег img:

$html = '<img src="' . $_POST['chart_input'] . '">'; 
$dompdf->load_html($html); 
$dompdf->render(); 
$dompdf->stream('chart.pdf'); 
Смежные вопросы