node-highcharts-exporting-v2 是一个 Node.js 模块，它提供了对 Highcharts 图表的导出功能。使用这个模块，我们可以将 Highcharts 图表保存为 PNG、JPEG、PDF 和 SVG 文件，或者将其作为 dataURI 直接嵌入到网页中。
在本文中，我们将探讨如何使用 node-highcharts-exporting-v2 模块来导出 Highcharts 图表。我们将从安装模块开始，一步一步地介绍如何使用该模块，以及如何在实际项目中应用它。
安装
要使用 node-highcharts-exporting-v2 模块，我们首先需要安装它。我们可以通过下面的 npm 命令来安装它：
npm install node-highcharts-exporting-v2
安装完成后，我们就可以在项目中使用它了。
基本用法
首先，我们需要引入 node-highcharts-exporting-v2 模块：
const exportChart = require('node-highcharts-exporting-v2');接着，我们需要创建一个 Highcharts 图表，并将其传递给 exportChart 函数：
-- -------------------- ---- -------
----- ----- - ----------------------------- -
------ -
----- -------- ------- -------------
--
--------- -
----- -------- ------------------
--
------ -
----------- ------- ------ ------ ------ ------ ------
------ ------ ------ ------ ------ -------
--
------ -
------ -
----- ------------ ------
--
--
------- --
----- --------
----- ----- ---- ---- ----- ----- ----- ----- ----- ----- ----- ----- -----
-- -
----- ---- ------
----- ------ ---- ---- ----- ----- ----- ----- ----- ----- ----- ---- -----
-- -
----- ---------
----- ------ ---- ---- ---- ----- ----- ----- ----- ----- ---- ---- -----
-- -
----- ---------
----- ----- ---- ---- ---- ----- ----- ----- ----- ----- ----- ---- -----
---
---
------------------ -------- -------- ----- ----- -
-- ----- -
--------------------- -----
- ---- -
--------------------------
-
---在这个示例中，我们创建了一个包含四个系列的 Highcharts 图表，并将它传递给 exportChart 函数。我们还传递了一个 options 对象，这个对象包含导出图表的设置，例如导出格式、尺寸和文件名等。在回调函数中，我们可以获取导出的结果，这里是一个包含图表的 dataURI。
options 对象
exportChart 函数的第二个参数是一个包含导出图表设置的 options 对象。我们可以使用这个对象来指定导出格式、尺寸和文件名等。
下面是 options 对象的一些常用属性：
type：导出的格式。可以是'png'、'jpeg'、'pdf'或'svg'。默认值是'png'。width：导出图表的宽度，单位是像素。默认值是800。height：导出图表的高度，单位是像素。默认值是600。filename：导出文件的文件名。默认值是'chart'。options：Highcharts 的导出选项。默认为{}。
下面是一个使用示例：
-- -------------------- ---- -------
----- ------- - -
----- ------
--------- ---------------
------ -----
------- ----
-------- -
------ -
---------------- ----------
--
--
--
------------------ -------- -------- ----- ----- -
-- ----- -
--------------------- -----
- ---- -
--------------------------
-
---在这个示例中，我们指定了导出格式为 'pdf'，文件名为 'my-chart.pdf'，宽度为 1200，高度为 800，并设置了背景色为灰白色。
常见问题
如何使用导出的图片？
导出的结果是一个带有 dataURI 的对象。要在网页中显示导出的图片，我们可以使用如下代码：
const img = new Image(); img.src = data.dataURI; document.body.appendChild(img); // 将图片插入网页中
如果想要将导出的图片保存到本地，可以使用如下代码：
const link = document.createElement('a');
link.href = data.dataURI;
link.download = 'my-chart.png';
link.click(); // 模拟用户点击下载这将会弹出一个下载对话框，用户可以选择保存图片到本地。
如何应对跨域访问的问题？
当我们在本地的网页中加载远程 Highcharts 库时，可能会出现跨域访问的问题。为了解决这个问题，我们可以在服务器端设置一个代理，然后将代理地址传递给 Highcharts 库。
下面是一个使用 Express 框架实现代理的示例：
-- -------------------- ---- -------
----- ------- - -------------------
----- ----- - ---------------------------------
----- --- - ----------
---------------------- -------
------- ------------------------------
------------- -----
------------ -
--------------- --- -- - ----------- ------------- ---------- -------
--
----
---------------- -------- -- -
------------------- -- ------- -- ------------------------
---在这个示例中，我们使用 http-proxy-middleware 模块实现了一个代理。当我们需要加载 Highcharts 库时，只需要将 https://code.highcharts.com 替换为 /highcharts 即可。例如：
<script src="/highcharts/highcharts.js"></script>
完整的示例代码请参考 GitHub 仓库。
结论
使用 node-highcharts-exporting-v2 模块可以方便地将 Highcharts 图表导出为各种格式的文件或 dataURI，并且不需要依赖浏览器或服务器的环境。本文介绍了它的基本用法以及常见问题的解决方法，希望能对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600562c981e8991b448e00e0