JS流程图解决方案GoJS

GoJs简介

一个实现交互类图表(比如流程图,树图,关系图,力导图等等)的JS库
GoJS依赖于HTML5,所以请保证您的浏览器版本支持HTML5,当然还要加载这个库。

首先个人建议先下载官方实例的 离线版本【内网访问不是很好所以建议缓存下载下来在来看】,其次希望你有个谷歌浏览器!(方便于翻译成中文阅读不费劲!)

下载界面 https://gojs.net/latest/download.html

点击这里下载


 <!-- 调式或开发模式下请使用 go-debug.js -->
  

 <!-- f非调式或开发模式下请使用 go.js -->
  

每个GoJS图表必须包含在一个指定宽高的div容器内

<!-- 这个DIV必须指定宽高,否者不会被渲染出来
     我们通常为DIV设置一个背景颜色以便于我们更便捷的观察 -->
<div id="myDiagramDiv"
     style="width:400px; height:150px; background-color: #DAE4E4;"></div>

在JS代码部分,您需要传入一个div的id作为参数来创建一个图表,这里不多说案例里很明了多看!

var $ = go.GraphObject.make;
var myDiagram =
  $(go.Diagram, "myDiagramDiv");

PS : 所有GoJS的属性和方法都在go这个命名空间下。所有GoJS的类名,例如Diagram、Node、Panel、 Shape、TextBlock也都使用go作为前缀

入门教程看这里

猜你喜欢

转载自www.cnblogs.com/userzf/p/11327024.html