简介
GoJS 是一个强大的 JavaScript 库，用于创建交互式、可自定义的图表和流程图。GoJS 能够帮助开发者快速、简单地构建可视化界面，是前端开发中非常实用的工具之一。
在本文中，我们将学习如何通过 npm 包来使用 GoJS，并使用几个示例来演示 GoJS 的基本用法。
安装
要使用 GoJS，首先需要安装它。可以通过 npm 包管理器来安装 GoJS：
--- ------- ----
基本使用
下面的代码演示了如何使用 GoJS 在 Web 页面上创建简单的流程图：
--------- -----
------
------
----------- ---------------
------- ----------------------------------------------------
-------
------
---- ----------------- ------------------- ---------------------
--------
--- - - --------------------
--- --------- -
------------- ---------------
- -- ------- ---------- -- ---
---------------------- -
---------- -------
----------- ------------ - ----- ------- ---
--------------- - ------- - --
--- ------------------ -------
--
--------------- -
---------------------
- -------------- -
- ---- ------- --
- ---- ------ -
----
---------
-------
-------在这个例子中，我们使用了 go.GraphObject.make 来创建 GoJS 对象，然后创建一个 Diagram 对象，并设置它的节点模板和数据模型。
示例代码
以下是几个示例代码，演示了 GoJS 的基本用法。
基本流程图
下面的代码演示了如何使用 GoJS 创建一个简单的流程图：
--------- -----
------
------
----------- ---------------
------- ----------------------------------------------------
-------
------
---- ----------------- ------------------- ---------------------
--------
--- - - --------------------
--- --------- -
------------- ---------------
-
------------------------ -----
------------------------- ----
------------------------ --------------
---
---------------------- -
---------- -------
----------- ------------ - ----- ------- ---
--------------- - ------- - --
--- ------------------ -------
--
---------------------- -
----------
------------
----------- - -------- ---------- --
--
--------------- -
---------------------
-
-------------- -
- ---- ------- --
- ---- ------ --
- ---- ------- --
- ---- ------- -
--
-------------- -
- ----- -------- --- ------ --
- ----- ------- --- ------- --
- ----- -------- --- ------- -
-
---
---------
-------
-------点击事件
下面的代码演示了如何使用 GoJS 添加一个点击事件：
--------- -----
------
------
----------- ---------------
------- ----------------------------------------------------
-------
------
---- ----------------- ------------------- ---------------------
--------
--- - - --------------------
--- --------- -
------------- ---------------
-
------------------------ -----
------------------------- ----
------------------------ --------------
---
---------------------- -
---------- -----
- ----------------------------------------------------------- --------
---------------------------------------------------------------------------------------