对于需要自动生成图表、纯后端生成图表图片、批量生成图表的情况,Nodejs 导出服务器可以满足这些需求。

一、安装 Nodejs 导出服务器

请参考 搭建导出服务器 进行安装,简单来说有两种安装方式

1、直接安装 npm 包

  1. npm install highcharts-export-server -g

2、源代码安装

  1. git clone https://github.com/highcharts/node-export-server
  2. npm install
  3. npm link

二、命令行导出

Nodejs 导出服务器运行方法:

  1. highcharts-export-server <参数>

通用参数

  • —infile:指定输入的文件
  • —instr:指定输入的内容(JSON 字符串或 SVG 字符串)
  • —options:同 —instr
  • —outfile:指定输出文件
  • —allowFileResources:允许从文件系统中读取内容,默认是 true,当导出服务器以 HTTP 服务运行是该参数无效。
  • —type:指定导出文件的类型,可用的值有:jpg、png、svg、pdf
  • —scale:图表缩放比例
  • —width:指定图表的宽度
  • —constr:生成图表类型,可用的值有 Chart 和 StockChart
  • —callback:指定图表回调函数执行的 js 文件
  • —resources:额外的资源
  • —batch:批量导出,示例:"—batch input.json=output.png;input2.json=output2.png;…"
  • —logDest <路径>:日志文件目录
  • —logFile <文件名>:指定日志文件名(不包含路径),默认是 highcharts-export-server.log。注意需要设置 —logDest参数才能启用日志功能
  • —logLevel <0 ~ 4>:日志级别,0 = 关闭日志,1 = 错误,2 = 警告,3 = 通知,4 = 流水日志
  • —fromFile "options.json":从文件中读取命令行配置
  • —tmpdir:临时目录,用于存储临时的输出文件
  • —workers:线程数
  • —workLimit:phantomjs 工作限制(Phantomjs 运行超过这个次数将会重启)
  • —listenToProcessExits:设置为 0 可以跳过额外的 process.exit 处理步骤。请注意,禁用此操作可能会导致僵尸进程!
  • —globalOptions:传递给 Highcharts.setOptions 的 JSON 字符串
    HTTP 服务相关参数:

  • —enableServer <0 或 1>:是否以 HTTP 的形式运行,参数值为 1的时候表示启动 HTTP 服务

  • —host:服务器运行的地址
  • —port:端口号
  • —sslPath:SSL证书地址,表示以提供 HTTPS 协议服务
  • —sslPort:HTTPS 服务端口号
  • —sslOnly:是否只使用 HTTPS 协议
  • —rateLimit:请求限制,表示一分钟允许的最大请求数,默认是关闭这个限制
    更多详情请参考 官方文档

1、使用实例

1)将图表配置转换成 PNG 图片

  1. highcharts-export-server --infile options.json --outfile chart.png

options.json 的内容为

  1. {"title":{"text":"不同城市的月平均气温","x":-20},"subtitle":{"text":"数据来源:WorldClimate.com","x":-20},"xAxis":{"categories":["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"]},"yAxis":{"title":{"text":"温度(°C)"},"plotLines":[{"value":0,"width":1,"color":"#808080"}]},"tooltip":{"valueSuffix":"°C"},"legend":{"layout":"vertical","align":"right","verticalAlign":"middle","borderWidth":0},"series":[{"name":"东京","data":[7,6.9,9.5,14.5,18.2,21.5,25.2,26.5,23.3,18.3,13.9,9.6]},{"name":"纽约","data":[-0.2,0.8,5.7,11.3,17,22,24.8,24.1,20.1,14.1,8.6,2.5]},{"name":"柏林","data":[-0.9,0.6,3.5,8.4,13.5,17,18.6,17.9,14.3,9,3.9,1]},{"name":"伦敦","data":[3.9,4.2,5.7,8.5,11.9,15.2,17,16.6,14.2,10.3,6.6,4.8]}]}

2)批量转换

  1. highcharts-export-server -batch "infile1.json=outfile1.png;infile2.json=outfile2.png;infile3.json=outfile3.png;"

2、其他服务端语言调用

其他服务端语言可以通过执行命令的形式来调用 Nodejs 导出服务器,下面是用 Java 和 PHP 进行渲染图表的示例代码:

Java 示例代码

  1. public Class Test {
  2. public static void main(String[] args) {
  3. String options = "D:\\test\options.json";
  4. String cmd = "highcharts-export-server --infile " + options + " --outfile chart.png";
  5. try {
  6. Runtime run = Runtime.getRuntime();
  7. Process p = run.exec(cmd);
  8. BufferedInputStream in = new BufferedInputStream(p.getInputStream());
  9. BufferedReader inBr = new BufferedReader(new InputStreamReader( in ));
  10. String lineStr;
  11. while ((lineStr = inBr.readLine()) != null) {
  12. System.out.println(lineStr);
  13. }
  14. inBr.close(); in .close();
  15. } catch (IOException e) {
  16. e.printStackTrace();
  17. }
  18. }
  19. }

PHP 示例代码

  1. $options = "D:\\test\options.json";
  2. $output = shell_exec("highcharts-export-server --infile ".$options." --outfile chart.png");
  3. echo $output;

三、作为模块在 Nodejs 中使用

Nodejs 导出服务器可以以模块的形式在 Nodejs 程序中使用,下面是简单的示例代码:

  1. // 加载导出模块
  2. const exporter = require('highcharts-export-server');
  3. //导出配置
  4. var exportSettings = {
  5. type: 'png',
  6. options: {
  7. title: {
  8. text: 'My Chart'
  9. },
  10. xAxis: {
  11. categories: ["Jan", "Feb", "Mar", "Apr", "Mar", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
  12. },
  13. series: [{
  14. type: 'line',
  15. data: [1, 3, 2, 4]
  16. }, {
  17. type: 'line',
  18. data: [5, 3, 4, 2]
  19. }]
  20. }
  21. };
  22. // 启动 Phantomjs 线程池
  23. exporter.initPool();
  24. // 执行导出
  25. exporter.export(exportSettings, function(err, res) {
  26. //导出的结果包含在 res 中
  27. //如果导出结果不是 PDF 或 SVG,那么结果是 base64 编码的内容,可以通过 res.data 来获取
  28. //如果导出结果是 PDF 或 SVG,那么结果是文件名,可以通过 res.filename 来获取
  29. //当所有的操作完毕后,关掉线程池并推出程序
  30. exporter.killPool();
  31. process.exit(1);
  32. });

更多详情请参考 官方文档

原文: https://www.hcharts.cn/docs/render-charts-serverside