GoJS 繪圖 (一) ：入門

X_AirDu 發(fā)布于2019-08-19 18:23 / 3025人閱讀

摘要：是一個(gè)庫，讓你輕松創(chuàng)建現(xiàn)代瀏覽器的交互圖。支持圖形化的模板和圖形對(duì)象屬性數(shù)據(jù)模型的數(shù)據(jù)綁定。許多預(yù)定義的工具和命令執(zhí)行，大部分的圖表所需要的標(biāo)準(zhǔn)的行為。外觀和行為的定制是大多設(shè)置屬性的問題。

GoJS是一個(gè)JavaScript庫，讓你輕松創(chuàng)建現(xiàn)代Web瀏覽器的交互圖。 GoJS支持圖形化的模板和圖形對(duì)象屬性數(shù)據(jù)模型的數(shù)據(jù)綁定。你只需要保存和恢復(fù)模型，包括持有任何性質(zhì)的應(yīng)用需求，簡(jiǎn)單的JavaScript對(duì)象。許多預(yù)定義的工具和命令執(zhí)行，大部分的圖表所需要的標(biāo)準(zhǔn)的行為。外觀和行為的定制是大多設(shè)置屬性的問題。

創(chuàng)建一個(gè)圖 HTML

javascript

   var diagram = new go.Diagram("myDiagramDiv");
    diagram.model = new go.GraphLinksModel(
      [{ key: "Hello" },   // two node data, in an Array
       { key: "World!" }],
      [{ from: "Hello", to: "World!"}]  // one link, in an Array
    );

這樣就完成了的“Hello World！”

GPU云服務(wù)器云服務(wù)器 python繪圖入門 GoJS 屏幕繪圖繪圖程序

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/79531.html

相關(guān)文章

GoJS 繪圖 (十) ：鏈接（完結(jié)）

摘要：非定向鏈接最簡(jiǎn)單的鏈接沒有箭頭指示方向。該模板只包含一個(gè)形狀為主要元素，因?yàn)檫@是在節(jié)點(diǎn)之間繪制的線條。鏈接的路線被計(jì)算后將得到一個(gè)路徑的點(diǎn)。可以很容易地建立方向，只需添加一個(gè)形狀并設(shè)置其屬性。目前也就只能先寫這么多吧入門的話問題不大了非定向鏈接最簡(jiǎn)單的鏈接沒有箭頭指示方向。該模板只包含一個(gè)形狀為主要元素，因?yàn)檫@是在節(jié)點(diǎn)之間繪制的線條。鏈接的路線被計(jì)算后將得到一個(gè)路徑的點(diǎn)。 diag...

Rocko 2019-08-22 10:33 評(píng)論0 收藏0
記一次繪圖框架技術(shù)選型: jsPlumb VS mxGraph

摘要：公司項(xiàng)目需要用到繪圖框架，繪圖部分以前是另一位同事負(fù)責(zé)，用的是框架?；谝陨咸峒暗降姆N種原因，上年年末我做起了技術(shù)調(diào)研，希望能找到一個(gè)合適我們項(xiàng)目的繪圖框架。兼容性問題項(xiàng)目對(duì)瀏覽器兼容性比較寬松，瀏覽器兼容性問題不在考慮范圍之內(nèi)。 showImg(https://ws3.sinaimg.cn/large/006tKfTcgy1g0ppk2kkhxj30ka0b4gm5.jpg); 公司...

longmon 2019-08-23 15:36 評(píng)論0 收藏0
記一次繪圖框架技術(shù)選型: jsPlumb VS mxGraph

摘要：公司項(xiàng)目需要用到繪圖框架，繪圖部分以前是另一位同事負(fù)責(zé)，用的是框架?；谝陨咸峒暗降姆N種原因，上年年末我做起了技術(shù)調(diào)研，希望能找到一個(gè)合適我們項(xiàng)目的繪圖框架。兼容性問題項(xiàng)目對(duì)瀏覽器兼容性比較寬松，瀏覽器兼容性問題不在考慮范圍之內(nèi)。 showImg(https://ws3.sinaimg.cn/large/006tKfTcgy1g0ppk2kkhxj30ka0b4gm5.jpg); 公司...

channg 2019-08-02 14:23 評(píng)論0 收藏0
GoJS 繪圖 (四) ：構(gòu)建節(jié)點(diǎn)與GraphObjects

摘要：你可以構(gòu)建一個(gè)節(jié)點(diǎn)或其類型的代碼。以下將討論基本類型，你可以用它來建立一個(gè)節(jié)點(diǎn)對(duì)象。這些頁面通過明確創(chuàng)建和添加節(jié)點(diǎn)和鏈路建立的示意圖。一個(gè)非常簡(jiǎn)單的節(jié)點(diǎn)由一個(gè)與構(gòu)成。雖然以這種方式構(gòu)建的節(jié)點(diǎn)將工作變得更加復(fù)雜的代碼將變得更加難以閱讀和維護(hù)。你可以構(gòu)建一個(gè)節(jié)點(diǎn)或其類型的JavaScript代碼。以下將討論基本類型，你可以用它來建立一個(gè)節(jié)點(diǎn)對(duì)象。這些頁面通過明確創(chuàng)建和添加節(jié)點(diǎn)和鏈路建立的...

jokester 2019-08-19 18:25 評(píng)論0 收藏0
GoJS 繪圖 (六) ：橫向面板（panel）

摘要：橫向面板屬性和縱向面板基本相同只是排列順序不同默認(rèn)對(duì)齊和拉伸垂直和水平兩個(gè)面板的支持的和屬性。這是一種便捷的方式使您不必設(shè)置每個(gè)元件的或橫向面板屬性和縱向面板基本相同只是排列順序不同 diagram.add(G( go.Part, go.Panel.Horizontal, { position: new go.Point(500, 0), ...

Hancock_Xu 2019-08-19 18:26 評(píng)論0 收藏0