Make whtmltoimage Wait for the Google chart API to fully display the chart

What am i trying to do

Open the .php page using exec with

 exec('./wkhtmltoimage-i386 abcdef.com/combined.php chart.jpg', $op, $er); 

to get an image of the chart being displayed.

What is really going on

chart.jpg not created at all when you start a page containing the above command.

Debugging

(1) I directly executed combined.php in the browser, and the graph displayed as expected. So there is nothing wrong with combined.php code.

(2) I also tried to deliver only

 <h1>Hello there!</h1> 

inside combined.php , and this led to the creation of chart.jpg and the output displayed as an image.

So, this makes me think that wkhtmltoimage will need to wait until the graph is rendered, and then perform the conversion operation. The fact is that I have no ideas on how to make the conversion process wait until everything is done.

Javascript code used to prepare the chart

 google.load('visualization', '1', {'packages':['corechart']}); google.setOnLoadCallback(drawChart); function drawChart() { var data = new google.visualization.DataTable(<?php echo $jsonTable; ?>); var options = { title: 'TNS',titleTextStyle: {color: "green"}, hAxis: {title: "MONTH", titleTextStyle: {color: "green"}}, vAxis: {title: "Percentage", titleTextStyle: {color: "green"},viewWindowMode: 'explicit', }, max: 100, min: 0, legend: { position: 'bottom' }, width:1000, height:550, pointSize: 8, backgroundColor:'#ddd9c3', is3D: 'true', height:550, vAxis: { gridlineColor: '#9d9983' }, colors: ['black', 'red', 'green', 'blue', 'yellow'] }; var chart = new google.visualization.LineChart(document.getElementById('tns1')); chart.draw(data, options); } 
+4
source share
1 answer

You can use the following settings to enable the display of JavaScript content.

 --enable-javascript --javascript-delay 

I assume this documentation is updated for this

http://madalgo.au.dk/~jakobt/wkhtmltoxdoc/wkhtmltoimage_0.10.0_rc2-doc.html

Attempt may be

 exec('./wkhtmltoimage-i386 --enable-javascript --javascript-delay 1000 abcdef.com/combined.php chart.jpg', $op, $er); 

Depending on how long it takes to undo everything. Keep in mind that various security restrictions can be set.

Some additional options that you will definitely want to explore

 --run-script // run a specific script after loading --debug-javascript // return javascript debug output --no-stop-slow-scripts --enable-local-file-access 
+3
source

Source: https://habr.com/ru/post/1483295/


All Articles