build立dynamicHighCharts和图像Highcharts与（主要）一个代码库？

我们已经为我们的网页创build了dynamic的HighCharts – 这些有一些JavaScript依赖和图表生成脚本。我们希望使用HighCharts新的HighCharts / Node / PhantomJS套件创build这些图表的PDF文件（请参阅新闻稿）。我们的image-gen节点服务器将运行在一个单独的box / vm上。我们如何做到这一点，而不必为同一个图表维护两个单独的代码库？我还不太熟悉Node，所以我不确定如何通过Web请求来请求脚本。我猜想许多HighCharts用户想要开始生成他们的一些图表，因为服务器端将会遇到与pipe理两个相关代码集类似的问题。

实质上，我们已经有了这个：

Webserver – > JSON（data）+ foo.js + bar.js + foo.html – >dynamic图表的网页。

我们想build立：

Web服务器 – > JSON（数据）+单独的节点服务器+ foo.js + bar.js – >图像可通过Web请求

显然有些冗余。我们如何pipe理依赖关系？

虽然节点真棒，但我觉得这种方法不必要的复杂，不得不移动许多可能会破坏的部分。所以我做了dynamic创build文件的超级简单解决scheme。我遇到的唯一问题是在将它添加到pdf后删除临时文件。它会打破PDF的渲染。并将目录设置为/ tmp，崩溃幻影。我现在想到的最好的办法是将临时生成的文件放在临时目录中，然后每天晚上用cronjob删除该目录中的所有内容。

我发布了这个代码简单。它应该在一个函数中，保持代码的可重用性。

 <?php $TmpInFileName = 'tmp/graph_'.md5($CurrentDate.rand(666,9482845713)).'.js'; $TmpGraphFileName = 'tmp/pnggraph_'.md5($CurrentDate.rand(2666,54713)).'.png'; $Data = " { chart: { zoomType: 'xy', width: 700, height: 520 }, credits: { enabled: false }, colors: [ '#2f7ed8', '#910000', '#8bbc21', '#1aadce', '#492970', '#f28f43', '#77a1e5', '#c42525', '#a6c96a' ], title: { text: 'Sample Graph - created at ".date('m/d/Y g:i:s a')."', style: { fontSize: '16px', } }, xAxis: [{ categories: ['00:00', '00:15', '00:30', '00:45', '01:00', '01:15', '01:30'] }], yAxis: [{ labels: { format: '{value}', style: { fontSize: '14px', color: Highcharts.getOptions().colors[1] } }, title: { text: 'Y axis', style: { fontSize: '16px', color: Highcharts.getOptions().colors[1] } } }, { // Secondary yAxis title: { text: 'Sec Yaxis', style: { fontSize: '16px', color: Highcharts.getOptions().colors[0] } }, labels: { format: '{value}', style: { fontSize: '14px', color: Highcharts.getOptions().colors[0] } }, opposite: true }], tooltip: { shared: true }, legend: { layout: 'horizontal', backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF' }, series: [{ name: 'first', type: 'spline', yAxis: 1, data: [0, -119.9502311075212, -119.96203992145706, -119.98172620218355, -119.71898290168028, -119.97023935590325, -119.95230287195413] }, { name: 'second', type: 'spline', yAxis: 1, data: [0, -119.24222667756482, -119.60905809195222, -119.63522965403729, -119.11011466187935, -119.63643171374981, -119.54969080301575] },{ name: 'third', type: 'column', data: [10, 11, 9, 7, 5, 2, 7] },{ name: 'fourth', type: 'column', data: [0, -0.7080044299563895, -0.35298182950484147, -0.34649654814626274, -0.6088682398009269, -0.33380764215343106, -0.40261206893838164] }] }"; try { $myfile = fopen($TmpInFileName, "w") or die("Unable to open file!"); fwrite($myfile, $Data); fclose($myfile); } catch (Exception $e) { echo 'Error: '.$e.' <br />'; } $URL_Command = "phantomjs /highcharts/exporting-server/phantomjs/highcharts-convert.js -infile $TmpInFileName -outfile $TmpGraphFileName -width 600"; exec($URL_Command); echo '<img src="'.$TmpGraphFileName.'" alt="Could not load img: '.$TmpGraphFileName.'">'; ?>

我希望这有帮助。我找不到一个不涉及Node.JS或Java的好解决scheme。我想要一个纯粹的PHP解决scheme。

我们决定将整个highchartsconfiguration对象（例如Highcharts.chart(configObj) ）作为URL编码的string传递给节点服务器。我们不得不在节点服务器上放置一些渲染函数，但并不是太糟糕。我们还在stringconfiguration对象中插入了一些渲染函数。不是最美的结果，但它的工作。