npm 包 echarts-server 使用教程

阅读时长 5 分钟读完

简介

echarts-server 是一个使用 Node.js 搭建的图表生成服务器,可以通过接口请求生成各种类型的图表。它支持各种图表类型,可以把生成的图表导出为图片或 PDF,可定制性强,非常适合于需要大量生成图表的项目中的使用。

在这篇文章中,我们将分享如何使用 echarts-server 来创建图表。

步骤

安装 echarts-server

首先,我们需要安装 echarts-server npm 包。在终端中输入以下命令:

创建服务器

接下来,我们需要创建一个服务器来监听请求并生成图表。echarts-server 对外暴露了两个接口,一个是 /echarts 生成图表,一个是 /export 导出图表。

我们可以创建一个 Express 服务器,并在 /echarts 路径下监听请求,把请求参数传递给 echarts-server,然后把生成好的图表 response 回去。

示例代码:

-- -------------------- ---- -------
----- ------- - -------------------
----- --- - ----------

----- ------------- - --------------------------

------------------- ----- ----- ---- -- -
  ----- ----- - ----- ---------------
    ------- -----------------
    ------ --------------- -- ----
    ------- ---------------- -- ----
  ---
  ----------------------------- -------------
  -----------------------
---

---------------- -- -- -
  ------------------- -----------
---

生成图表

有了服务器之后,我们就可以直接通过调用接口来生成图表了。我们需要把生成图表需要的参数以 query string 的形式传递给服务器,包括图表数据和图表配置。

示例代码:

-- -------------------- ---- -------
----- --- - --------------------------------
----- ------ - -
  ------ -
    ----- -------- ------
  --
  -------- ---
  ------- -
    ----- -------
  --
  ------ -
    ----- ------ ------ ------ ----- ------ ------
  --
  ------ ---
  ------- -
    -
      ----- -----
      ----- ------
      ----- --- --- --- --- --- ----
    --
  --
--

----- ------ - --- ------------------
----------------------- ------------------------

------------------------------------
  ----------- -- -
    ----- ----- - ------------------------------
    --------- - --------------------------------
    ---------------------------------
  ---

导出图表

如果我们需要把生成的图表导出为图片或 PDF,我们可以调用 /export 接口来完成。

示例代码:

-- -------------------- ---- -------
----- --- - -------------------------------
----- ------ - -
  ------ -
    ----- -------- ------
  --
  -------- ---
  ------- -
    ----- -------
  --
  ------ -
    ----- ------ ------ ------ ----- ------ ------
  --
  ------ ---
  ------- -
    -
      ----- -----
      ----- ------
      ----- --- --- --- --- --- ----
    --
  --
--

----- ------ - --- ------------------
----------------------- ------------------------
--------------------- -------
---------------------- -------
----------------------- -------

------------------------------------
  ----------- -- -
    ----- ----- - ------------------------------
    --------- - --------------------------------
    ---------------------------------
  ---

这里我们把导出图表需要的参数以 query string 的形式传递给服务器,包括图表类型(png、jpeg、pdf)、图表数据和图表配置,还有导出的图片大小和高度。

总结

以上就是 echarts-server 的使用教程,我们通过安装 echarts-server npm 包、创建服务器、生成图表和导出图表等步骤,共享了如何使用 echarts-server 来生成各种类型的图表。

使用 echarts-server 包可以为前端项目中常常存在的图表需求提供快速而简单的解决方案。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6005600681e8991b448ddd43

纠错
反馈