什么是 panhandler
panhandler 是一个能够在页面上创建易于定制的交互式图表的 npm 包。无需编写 JavaScript 代码，想要创建一个图表只需要写简单的配置文件即可。panhandler 是一个可以极大简化前端开发过程的工具，它可以让你专注于数据而不是代码。
安装 panhandler
--- ------- ----------
使用 panhandler
在你的项目中引用 panhandler，然后可以直接在 HTML 中写入配置文件并且使用 panhandler 渲染它。
配置文件
它是最重要的一个步骤，定义了如何渲染目标图表。它通常是嵌套的 JSON 对象，其中包含对齐方式、颜色、大小、形状、鼠标响应等元素的描述。
一个简单的饼图示例：
-
------- ------
------- -
--------- ------- ------- ----------
----------- -
-
------- ----- --- -----
------------------ ----------- ---------- ----------
-
-
-
-渲染图表
--------- -----
------
------
------- --------------------------------------
-------
------
---- -----------------
--------
--- ----- - ---------------------------------
--- ------ - -
-- ---
--
--- ----------------------- - ----- ------ ---
---------
-------
-------panhandler 的优势与缺点
优势
- 简化了前端代码开发流程，无需编写大量的 JavaScript 代码。
- 灵活度更高，配置文件可以实现更灵活的图表数据展示效果。
- 支持响应式设计，可以在不同大小的屏幕上显示同等效果。
缺点
- 不支持所有常见的图表类型。
- 配置文件语法需要学习，无法像编写 HTML 元素一样直观。
- 不能在运行时使用 JavaScript 对图表进行操作，你必须要更新配置文件。
结论
panhandler 是一个非常实用的工具，尤其是在前端初学者或者快速初步开发的情况下。panhandler 可以简化开发流程，无需手写过多的 JavaScript 代码实现图表功能，而且可以通过配置文件可随时调整图表效果，但无法跟手写代码一样自由度高。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600673defb81d47349e53b94