GoJS for HTML5/Canvas 是一套 JavaScript函式庫,用於繪製網頁精美的互動式圖表。可繪製多種互動式圖表,包括:Flowchart、state chart diagram、organizational chart diagram、Gantt chart 等。
- Fully Interactive Diagrams
- Extensible Layouts and Tool System
- Data-Binding and Models
- Transactional State and Undo-Management
- Mobile Support
- Supports Major Frameworks e.g. React, Angular
Data Binding & Templates
GoJS supports graphical templates and data-binding of object properties to model data. Only the model, consisting of simple JavaScript objects, needs to be saved and restored. GoJS makes it easy to read and write models in JSON format.
Thorough Documentation
We provide comprehensive API documentation and in-depth overviews of GoJS concepts, with interactive examples. With over 90 samples, you'll find numerous examples of GoJS properties and methods.
Lightning Fast Diagramming in the Browser
GoJS takes advantage of the HTML Canvas to support high-performance diagrams. For creating static documents and printable resources, GoJS supports exporting Diagrams to images and SVG.
GoDiagram是由C#建構成的圖表開發元件,用以嵌入.NET架構的程式。
並有詳盡的API搭配完整的說明文檔與範例使用。
GoDiagram提供各種基本圖形對象,如矩形,橢圓,多邊形,文本,圖像和線條。您可以將對象組合在一起以形成更複雜的對象。您可以通過設置屬性和覆蓋方法來自定義其外觀和行為。
GoDiagram View
GoDiagram視圖是一個顯示GoDiagram文檔的控件。它支持基於鼠標的對像操作,包括使用拖放選擇,調整大小,移動和復制。GoDiagram將輸入行為組織到您可以修改,覆蓋或添加或從視圖中刪除的工具中。該視圖還支持就地編輯,影印和網格。
GoDiagram Document
GoDiagram文檔實現了一個支持對像操作的模型。將對象添加到文檔使其在文檔的視圖中可見。您可以按層組織對象。GoDiagram支持組合和操作圖形(節點和弧形圖),其中節點具有通過鏈接連接的端口。
Flexibility and Extensibility
GoDiagram庫靈活且可擴展。預定義的節點類可以輕鬆構建多種圖形。通過設置屬性或子類化,您可以輕鬆地為特定於應用程序的目的自定義大多數對象。您可以將全新的圖形對象添加到現有框架中。
AutoLayout
為了提供更好的可定制性和易用性,Northwoods提供另一個庫Northwoods.Go.Layout作為單獨的選項。此選項通過為圖中的節點提供複雜的自動佈局算法來擴展GoDiagram。AutoLayout組件單獨出售和記錄。
Packed with Diagramming Concepts
GoDiagram makes it easy to build applications where users can see and manipulate graphs of nodes connected by links.
From simple diagrams to interactive workflows and complex system monitors, GoDiagram helps you quickly create rich displays for your diagramming needs.
Built-in and Customizable
GoDiagram contains several built-in node types and full sample applications to get your project started quickly. GoDiagram is built from the ground up in C# and is designed to be extensible for your custom needs.
Diagram Components for .NET Winforms
VS Partner GoDiagram provides diagramming components for .NET Winforms, and has been designed to take advantage of the many new features that Microsoft .NET provides. As a member of the Visual Studio Partner (VSP) Program, we work closely with Microsoft to ensure that our .NET products integrate seamlessly into Visual Studio.
GoXam for WPF 是用於 Microsoft WPF與Silverlight的圖表開發元件。
Comprehensive Diagramming
GoXam is built to save your project weeks of development by taking care of common Diagramming needs. Features include built-in node-and-link relationships, data-binding, subgraphs and groups, collapsible and expandable trees, overviews, layouts, and layering.
Automatic Layouts
GoXam comes with predefined layouts for automatic node and link positioning. GoXam features layouts for many types of diagrams, including circular layout, tree and force-directed layouts, and layered directed graphs, among others.
Diagramming in WPF and Silverlight
GoXam provides controls for implementing diagrams in WPF and Silverlight applications. GoXam was built from scratch, so it takes full advantage of all the features of Microsoft Silverlight and WPF. GoWPF is the implementation of GoXam for WPF 3.5 or later; GoSilverlight is the implementation of GoXam for Silverlight 4 or later.
Collapsing and Expanding Trees
A common technique for large graphs is to allow the user to control the visibility of parts of that tree. Expanding and collapsing subtrees is built into GoXam, as shown in this example where a button is bound to the IsExpandedTree property:
Layers
Graphical objects can be placed within layers to define their Z-order. A DiagramPanel has 9 layers by default, including layers for background, default and foreground nodes and links, as well as layers for input tools and adornments such as selection handles.
Palette Control
Many diagram applications use a palette to support drag and drop of new elements to the view. GoXam also provides a specialized kind of diagram called the Palette. It displays a number of nodes in a rectangular grid-like arrangement. You can use different DataTemplates than in your regular Diagram, in order to provide a smaller or simpler appearance for each item.
Overview Control
Sometimes graphs are so large that you can only see a portion of them at a reasonable zoom level. For such applications, we provide the Overview control. It displays a thumbnail of the whole model shown by another Diagram and shows that diagram's viewport. The user can click or drag in the Overview to scroll the other diagram's viewport.
Subgraphs / Groups
Many graph types, such as workflow or Business Process Modeling Notation (BPMN), use grouping techniques to organize diagrams. Groups are supported within GoXam, including support for data binding for the definition of the hierarchy and in DataTemplates that define the group's appearance.
Cut / Copy / Paste / Undo / Redo
Standard clipboard actions are enabled by default, but may be disabled for applications where it isn't desired. To support unlimited and customizable undo and redo, the UndoManager tracks changes to the diagram's model. Changes are logically grouped together by transactions.
Zooming / Scrolling / Panning / Selection
GoXam supports scrolling around and zooming into the diagram. You can scroll and zoom in or out programmatically by setting DiagramPanel properties. The user can scroll using the scrollbars or the PanningTool, and the user can zoom in or out using Control-Mouse-Wheel. GoXam controls support selection, and they make it easy to data-bind to the currently selected node. You can customize selection handles and tool handles (e.g. for resizing) by supplying custom data templates. In-place text editing of any text in the diagram is supported. Just click on any text that is enabled for text editing.
Predefined Shapes and Arrowheads
GoXam comes with over 195+ common shapes predefined for use in common node definitions. The Node Figures sample shows all of these shapes.
The Arrowheads sample shows the 65 predefined arrowhead designs.
XML Save/Restore
GoXam does not require any particular format or medium for storing diagrams. In many cases the application already has its own database schema or binary file format or whatever, so a good Control should not impose any storage requirements.
However, if you don't mind using XML as the document format, and if you don't have any particular XML schema to which you must adhere, and if you use our predefined model data classes, we do make it easy to save and load your model data in XML format. (The Org Chart Editor, State Chart, Logic Circuit and Flow Chart samples all demonstrate the use of XML save/restore.)