0

データベースから特定の従業員の名前、役職、写真を取得し、Gojs を使用してグラフに表示したいと考えています。私は Gojs の初心者で、静的な面しか知りません。クエリをどこに置くべきかわかりません。

<script>
var $ = go.GraphObject.make;

var myDiagram =
$(go.Diagram, "myDiagramDiv",
{
  initialContentAlignment: go.Spot.Center, // center Diagram contents
  "undoManager.isEnabled": true, // enable Ctrl-Z to undo and Ctrl-Y to redo
  layout: $(go.TreeLayout, // specify a Diagram.layout that arranges trees
            { angle: 90, layerSpacing: 40 })
});

// the template we defined earlier
myDiagram.nodeTemplate =
$(go.Node, "Vertical",
{ background: "#44CCFF" },
$(go.Picture,
  { margin: 10, width: 100, height: 100, background: "red" },
  new go.Binding("source")),
$(go.TextBlock, "Default Text",
  { margin: 12, stroke: "white", font: "bold 13px sans-serif" },
  new go.Binding("text", "name")),
$(go.TextBlock, "Default Text",
  { margin: 12, stroke: "white", font: "bold 13px sans-serif" },
  new go.Binding("text", "position"))
);

// define a Link template that routes orthogonally, with no arrowhead
myDiagram.linkTemplate =
$(go.Link,
{ routing: go.Link.Orthogonal, corner: 5 },
$(go.Shape, { strokeWidth: 3, stroke: "#555" })); // the link shape

var model = $(go.TreeModel);
model.nodeDataArray =
[
 { key: "1",              name: "JAMES BRYAN B. JUVENTUD", position: " (Regional Director)",  source: "james.jpg" },
{ key: "2", parent: "1", name: "VERGIL H. MEDIDAS", position: "OIC",   source:   "vergil.jpg" }

];
myDiagram.model = model;
</script>
4

1 に答える 1

2

Java Web アプリケーションでは、セッション Bean を使用して、データベースからすべてのノードを抽出し、それらを JSON 形式に変換して、(javascript および CDI Bean によって) 結果を .xhtml ページに入れることができます。これは、最終的にグラフを表示するページを意味します。また、GOJS 関連のすべてのコード (グラフを描画する gojs コマンド) を別の .js ファイルに入れて、以下の例に示すように .xhtml ファイルに追加することをお勧めします。

たとえば、.xhtml ページの head 部分に次のようなものを置きます。

<script type="text/javascript" > 
   ....
   var yournodeDataArray = JSON.parse('#{yourCDIBean.extractNodeArray()}');
   ....
</script>
 ..........
<script src="yourGojsDiagram.js"></script>
 ...........

yourCDIBean には、次のコードのようなものが必要です。

@Named ("yourCDIBean")
@SessionScoped
public class YourCDIBean implements Serializable {
    ......
    //inject your SessionBeans 
    @EJB
    private yoursessionBeanPackage.yourSessionBean  abean ;
    ..............

    public String extractNodeArray() {

       //accessing database by abean that is a SessionBean
       //converting result to jsonArray and then converting it to a string 
       //returning result
    }

linkDataArray を持つダイアグラムの場合、この方法も使用できます。次に、GojsDiagram.js ファイルで次の簡単なコマンドを使用してモデルを定義します。

yourDiagram.model = new go.GraphLinksModel(yourNodedataarray, yourLinkdataarray);

それが誰かを助けることを願っています。

于 2018-08-14T05:48:14.310 に答える