javascript - 将服务器端谷歌图表生成为图像

Question

我刚刚开始使用(新的)Google Charts API，它非常棒。我正在使用此 API 成功创建图表。

但是，我遇到了吞吐量挑战。在我的应用程序中，我根据从 NOAA 提取的实时数据生成了三个图表。获取数据、将其转化为图表形式然后在客户端绘制图表所花费的时间是一种令人无法忍受的缓慢用户体验。

所以我的想法是在(托管)服务器上定期(每 15-30 分钟)生成图表，然后只向访问者提供最新的图像。

我查看了 phantomjs(如 this post 中所推荐)，但它看起来像是使用了一个 .exe 文件，我无法将其上传到我的共享主机。

还有 this thread对于专有解决方案 (Highcharts)，但我想在继续 Highcharts 路径之前先探索开源替代方案。

其他解决方案侧重于允许用户将呈现的图表另存为图像，但我的目标是永远不要在浏览器中呈现图表，或者除了在页面请求时包含图像之外，不让任何服务器加载。

我还没有看到任何处理动态生成的图表的东西，这些图表会“自动”转换为在呈现页面时“自动”提供的图像。

总而言之，这是我试图拼凑的三个部分:

1) 从第三方(在本例中为 NOAA)提取数据并将数据呈现为 Google Chart(已完成，此处没有问题) 2) 将每个呈现的图表自动转换为图像，服务器端并创建图像 url 3) 在渲染之前将图表的图像 URL(将经常刷新)粘贴到网页的 html 中(通过 php)

附言可以为每个图表图像设置一个静态 URL...我不是在创建图像存档...

有什么建议吗？我错过了什么吗？

Answer 1

使用Watir加载网页并保存图像。 Watir 是一个基于 Ruby 的测试平台，旨在测试网页。我会做以下事情。

1. 创建一个呈现图表的网页。它不会是为了 公共(public)用途，仅用于生成图表图像。
2. 添加 Javascript 为每个图表调用 getImageURI() 以获取 PNG 数据。
3. 使用 Ajax 在服务器上调用 PHP 脚本。传入PNG数据 并将其保存到文件中。
4. 在 Watir 中编写一个脚本，只需打开浏览器并加载您的 网页。
5. 安排 Watir 脚本按您希望的频率运行。

Watir 脚本可以在任何本地计算机(PC 或 Mac)甚至服务器上运行。

这是通过 Ajax 将 PNG 数据发送到 PHP 脚本的 Javascript。这只是获取图像数据并发送它的片段，而不是完整的解决方案。

// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.PieChart(chartDiv);
// Wait for the chart to finish drawing before calling the getImageURI() method.
google.visualization.events.addListener(chart, 'ready', function () {
    pieDone=1;
    piePNG=chart.getImageURI();
    saveChartPNGs(piePNG); 
});
chart.draw(data, options);

function saveChartPNGs(png)
{
  var jsonSavePNG = $.ajax({
    type: "POST",
    url: pngSaveUrl,
    dataType:"json",
    data: 'png=' + png
  }).done();
}

此 PHP 代码处理 Ajax 调用并保存文件。

if (isset($_REQUEST['png']))
{
    // Remove header string
    $data=str_replace('data:image/png;base64,','',$_REQUEST['png']);
    // Restore data to original format; convert space to '+'
    $data=str_replace(' ','+',$data);
    // Save PNG file
    $outFile=DOC_ROOT.'/atest.png';
    // Decode base 64 before saving
    $fres=file_put_contents($outFile, base64_decode($data));
}

在您的本地计算机上，Watir 脚本(实际上是用 Ruby 编写的)很简单。

# Load watir
require 'watir-webdriver'
require "watir-webdriver/extensions/alerts"

# Launch the browser; common choices: chrome, firefox, ie.
# Headless browsers are available.
browser = Watir::Browser.new :chrome # chrome browser window

# Load the web page
browser.goto 'http://domain.net/page/'

为了让 Watir 端完全自动化，我会编写图表渲染网页，以便在完成文件保存后加载新页面。您可以让 Watir 在浏览器中检查该页面，然后退出，直到它再次执行。

如果您可以安排在您的服务器上安装 Ruby、Watir 和浏览器，那么您可以使用 cron 作业自动化整个场景。