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 应用程序中,您可以使用 Session Beans 从数据库中提取所有节点并将它们转换为 JSON 格式并将结果(通过 javascript 和 CDI Beans)放在您的 .xhtml 页面中,我的意思是最终显示您的图表的页面。此外,最好将所有与 GOJS 相关的代码(绘制图形的 gojs 命令)放在单独的 .js 文件中,并将其添加到 .xhtml 文件中,如下例所述。

例如,在您的 .xhtml 页面的头部放置如下内容:

<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 回答