当我在命令行中运行 php 文件时自动将谷歌图表转换为 PNG 图像（不在浏览器中）

Question

我从 chart.getImageURI() 函数获取图像 URL。 但是当我在没有浏览器的情况下运行 php 文件时，我如何自动移动到我的本地服务器文件夹。 我用命令行运行 php 文件.....在 SSH 中。

任何人都可以解释我该怎么做。 提前致谢。

<script type="text/javascript">

                 google.charts.load("current", {packages:['corechart']});

              google.charts.setOnLoadCallback(drawChart);

            function drawChart() {

                var data = new google.visualization.DataTable(//jsonarray hear);


                    var options = {
                  title: 'Title of Graph',
                  curveType: 'function',
                  width: 800,
                  height: 400

                };



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

                  google.visualization.events.addListener(chart, 'ready', function () {

                    var imgURL = chart.getImageURI();
                    chart_div.innerHTML = '<img src="' + chart.getImageURI() + '">';
                });


               chart.draw(data, options);

            }

        </script>


        <div id=\"chart_div\"></div>";  

我在我的 php 文件顶部添加了脚本。

图表是创建的，它的工作很好。 但我想要这个图形在我的本地服务器上的特定文件夹中的 png 图像文件中。 这个 PHP 文件不能在浏览器中运行。 它作为命令行在 SSH 中运行。所以我想自动将图表保存在图像中。

Answer 1

为此，您必须使用无头浏览器来执行 js 并在服务器端呈现谷歌图表。

您可以将PhantomJs与这个库PhantomJS-Google-Charts 一起使用

这是一个例子：用这个创建一个 js 文件（例如 generate.js ）

var system = require('system');
var args = system.args;

// require PhantomJS-Google-Charts library
var GC = require('/path/to/googleCharts.js');

// google chart data as first argument
var jsonData = JSON.parse(args[1]);

GC.generateChart(jsonData, function(svgHtml){

    //filename where to save the chart as second arg
    var fileName = args[2];

    var page = require('webpage').create();

    page.content = svgHtml;

    page.render(fileName);

    phantom.exit();
});

然后在 php 脚本中使用exec函数执行 phantomJs 命令，它将图形呈现为图像：

exec("/path/to/phantomJs /path/to/generate.js '{chartOptions}' path/to/image.png");