GoJSは、JavaScriptおよびHTML5 Canvasプログラムでフローチャートを作成し、JavaScript / Canvasプログラムを大幅に簡素化するのに役立つ、強力で高速かつ軽量のフローチャートコントロールです。

HuiduはGoJSの最新バージョンをダウンロードします

GoJS入門

GoJSは、データの視覚化、描画ツール、グラフエディタなど、さまざまな種類のインタラクティブグラフを作成するために使用できる柔軟なライブラリです。サンプルのフローチャート、組織図、ビジネスプロセスBPMN、スイムレーン、タイムテーブル、状態図、かんばん、ネットワーク、マインドマップ、サンキー、系図および系図図、フィッシュボーン図、フロアプラン、UML、意思決定ツリー、PERTがあります。グラフ、ガントチャート、そして何百人もの人々。GoJSには、ツリーレイアウト、力指向、放射状および階層指向のグラフレイアウト、および多くのカスタムレイアウトの例を含む、多くの組み込みレイアウトが含まれています。

GoJSは、HTML Canvas要素レンダリング（SVGまたは画像形式にエクスポート）を使用します。GoJSは、Webブラウザーで実行することも、NodeまたはPuppeteerのサーバー側で実行することもできます。GoJSダイアグラムはモデルでサポートされており、通常はJSONを介して保存およびロードされます。

gojs.netでGoJSの詳細をご覧ください。
このリポジトリには、すべての例、拡張機能、およびドキュメントのライブラリとソースが含まれています。GitHubリポジトリを使用して、すべてのソースをすばやく検索できます。

サンプル

1つ以上のテンプレート（必要な属性データバインディングを使用）を作成し、モデルデータを追加して、図を作成します。
<script src = "go.js"> </ script>

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>
上記の図とモデルコードは、次の図を作成します。ユーザーは、ノードまたはリンクをクリックして、それらを選択、コピーして貼り付け、ドラッグ、削除し、マウスまたは指を使用してスクロール、パン、ズームできるようになりました。

サポート
NorthwoodSoftwareは、プロジェクトの開始を支援する1か月間の無料の開発者間サポートをGoJSに提供します。

公式のGoJSフォーラムを読んで検索し、質問に関連するトピックを見つけてください。

販売やライセンスに関する質問など、GoJSに関する技術以外の質問については、NorthwoodsSoftwareの連絡フォームにアクセスしてください。

正規のGoJSライセンスを購入する場合、または製品情報の詳細については、[オンラインカスタマーサービスに相談する]をクリックしてください。

HTMLチャート用のフローチャート制御GoJSJavaScriptライブラリ

GoJS入門

おすすめ