Hi, I am trying to display a pie chart in a generated report.
The code currently used displays X / 100 (38 /100) <tr><td><?php echo __( 'Average Pagespeed', 'mainwp-pro-reports-extension' ); ?></td><td>[pagespeed.average.desktop] / 100</td></tr> [/remove-if-empty] <?php var_dump(do_shortcode( '[pagespeed.average.desktop]' )); ?> gives me string(27) "38" So I try to make the pie-chart like this <div id="piechart"></div> <script type="text/javascript" src=" https://www.gstatic.com/charts/loader.js";></script> <script type= "text/javascript"> // Load google charts google.charts.load('current', {'packages':['corechart']}); google.charts.setOnLoadCallback(drawChart); <?php $a = do_shortcode( '[pagespeed.average.desktop]' ); ?> // Draw the chart and set the chart values function drawChart() { var data = google.visualization.arrayToDataTable([ ['Work', <?php echo $a; ?>], ['test', 100], ]); // Optional; add a title and set the width and height of the chart var options = {'title':'My Average Day', 'width':550, 'height':400}; // Display the chart inside the <div> element with id="piechart" var chart = new google.visualization.PieChart(document.getElementById('piechart')); chart.draw(data, options); } </script> But nothing shows .... If I try <!DOCTYPE html> <html lang="en-US"> <body> <h1>My Web Page</h1> <div id= "piechart"></div> <script type="text/javascript" src=" https://www.gstatic.com/charts/loader.js";></script> <script type= "text/javascript"> // Load google charts google.charts.load('current', {'packages':['corechart']}); google.charts.setOnLoadCallback(drawChart); <?php $a = do_shortcode( '[pagespeed.average.desktop]' );; $b = 100 - (int)$a; $c = 4; $d = 2; $e = 8; ?> // Draw the chart and set the chart values function drawChart() { var data = google.visualization.arrayToDataTable([ ['Task', 'Hours per Day'], ['Work', <?php echo (int)$a; ?>], ['Eat', <?php echo $b; ?>], //['TV', <?php echo $c; ?>], //['Gym', <?php echo $d; ?>], //['Sleep', <?php echo $e; ?>] ]); // Optional; add a title and set the width and height of the chart var options = {'title':'My Average Day', 'width':550, 'height':400}; // Display the chart inside the <div> element with id="piechart" var chart = new google.visualization.PieChart(document.getElementById('piechart')); chart.draw(data, options); } </script> </body> </html> It shows only 100% (red circle) -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsubscr...@googlegroups.com. To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/5ea0d870-4296-42e1-aecf-670eac4fceed%40googlegroups.com.
