1. 产品
  2.   图表
  3.   JavaScript
  4.   mxGraph 

mxGraph 

 
 

开源 JavaScript 图表库

通过开源免费 JavaScript 图表库生成交互式图表和图表应用程序。

mxGraph 是一个开源的 JavaScript 图表库，提供渲染 SVG 和 HTML 图表的功能。使用 mxGraph 库不需要第三方软件。另一个好处是它不需要插件，几乎可以集成到任何框架中。 mxGraph 提供旨在显示交互式图表和图形的功能。 API 提供了所有常用的功能来绘制、交互以及将上下文与图表相关联。

API 使用一种非常通用的架构，它需要一个能够处理 HTML 页面的 Web 服务器和一个支持 JavaScript 的 Web 浏览器。它主要使用一个包含所有库功能的 JavaScript 文件。该文件被加载到 JavaScript 部分的 HTML 网页中，并在浏览器的 HTML 容器中执行

Previous Next

mxGraph 入门

安装 mxGraph 的推荐方法是通过 npm，它可以通过 npm 包管理器获得。要将 mxGraph 用作依赖项，请使用 npm install。

通过 npm 安装 mxGraph

npm install mxgraph --save

通过 JavaScript API 生成图表

开源 mxGraph 库提供了使用 JavaScript 创建图表的功能。它还支持通过创建新的图形编辑器或自定义它们来修改复杂的图形。首先，您需要在给定容器内创建一个图形，然后您可以轻松地将单元格添加到模型中以构建图形。您可以轻松地为多个参与者添加图表标题和注释。该库还提供其他功能，如视觉效果、用户界面控制等。

通过 JavaScript 合并两个图

mxGraph 使计算机程序员能够在他们自己的 JavaScript 应用程序中合并两个图形。首先，您需要在给定的容器内创建一个示例图。请用白色粗体标签使所有单元格变圆。现在请创建没有容器的第二个图形模型。使用顶点的自定义 id 在一个步骤中将单元格添加到目标模型。现在您可以将第二个图的模型合并到第一个图的模型中。

使用 JavaScript 绘制网格

mxGraph 库使软件开发人员能够在他们自己的 JavaScript 应用程序中动态绘制网格。您可以使用 HTML 5 画布轻松动态地绘制网格。首先请在给定容器内创建图形并动态创建需要画布的网格。您需要修改事件过滤以接受画布作为容器。现在可以根据需要学习背景并设置网格线的距离（以像素为单位）。现在绘制实际的网格。

 中国人