原創|行業資訊|編輯:楊鵬連|2020-12-15 11:24:36.577|閱讀 317 次
概述:GoJS是一個JavaScript和TypeScript庫,用于創建和處理圖,圖表和圖形。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關鏈接:
GoJS是一款功能強大,快速且輕量級的流程圖控件,可幫助你在JavaScript 和HTML5 Canvas程序中創建流程圖,且極大地簡化您的JavaScript / Canvas 程序。
GoJS入門
GoJS是一個靈活的庫,可用于創建多種不同類型的交互式圖,包括數據可視化,繪圖工具和圖形編輯器。有樣品流程圖,組織結構圖,業務流程BPMN,泳道,時間表,狀態圖,看板,網絡,思維導圖,桑基,家譜和系圖圖,魚骨圖,平面圖,UML,決策樹,PERT圖,甘特圖,和數百人。GoJS包括許多內置布局,包括樹形布局,力導向,徑向和分層的有向圖布局,以及許多自定義布局示例。
GoJS使用HTML Canvas元素渲染(導出為SVG或圖像格式)。GoJS可以在Web瀏覽器中運行,也可以在Node或Puppeteer的服務器端運行。GoJS Diagrams由模型支持,通常通過JSON保存和加載。
該存儲庫包含所有示例,擴展和文檔的庫和源。您可以使用GitHub存儲庫快速搜索所有源。
樣本
通過創建一個或多個模板(具有所需屬性數據綁定)并添加模型數據來構造圖。
<script src="go.js"></script> <script id="code"> function init() { var $ = go.GraphObject.make; // for conciseness in defining templates var myDiagram = $(go.Diagram, "myDiagramDiv", // create a Diagram for the DIV HTML element { // enable undo & redo "undoManager.isEnabled": true }); // define a simple Node template myDiagram.nodeTemplate = $(go.Node, "Auto", // the Shape will go around the TextBlock $(go.Shape, "RoundedRectangle", { strokeWidth: 0, fill: "white" }, // default fill is white // Shape.fill is bound to Node.data.color new go.Binding("fill", "color")), $(go.TextBlock, { margin: 8 }, // some room around the text // TextBlock.text is bound to Node.data.key new go.Binding("text", "key")) ); // but use the default Link template, by not setting Diagram.linkTemplate // create the model data that will be represented by Nodes and Links myDiagram.model = new go.GraphLinksModel( [ { key: "Alpha", color: "lightblue" }, { key: "Beta", color: "orange" }, { key: "Gamma", color: "lightgreen" }, { key: "Delta", color: "pink" } ], [ { from: "Alpha", to: "Beta" }, { from: "Alpha", to: "Gamma" }, { from: "Beta", to: "Beta" }, { from: "Gamma", to: "Delta" }, { from: "Delta", to: "Alpha" } ]); } </script>上面的圖和模型代碼創建以下圖。用戶現在可以單擊節點或鏈接以選擇它們,復制并粘貼它們,拖動它們,刪除它們,使用鼠標或手指滾動,平移和縮放。
諾斯伍德軟件為GoJS提供為期一個月的免費開發人員對開發人員支持,以幫助您開始進行項目。
閱讀和搜索GoJS官方論壇以查找與您的問題有關的任何主題。
對于有關GoJS的任何非技術性問題,例如有關銷售或許可的問題,請訪問Northwoods Software的聯系表。
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉載自: