前台代码:
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <script src="/lib/go-js/assets/js/go.js"></script> <script id="code" th:inline="javascript"> /*<![CDATA[*/ function init() { var keynode, mapnode; keynode = eval([[${nodekey}]]); mapnode = eval([[${nodemap}]]); console.log(keynode); console.log(mapnode) if (window.goSamples) goSamples(); var $ = go.GraphObject.make; myDiagram = $(go.Diagram, "myDiagramDiv", { initialContentAlignment: go.Spot.Center, "undoManager.isEnabled": true }); myDiagram.nodeTemplate = $(go.Node, "Auto", $(go.Shape, "RoundedRectangle", {strokeWidth: 1}, new go.Binding("fill", "color")), $(go.TextBlock, {margin: 20, 60, height: 20}, new go.Binding("text", "key")) ); // 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: "Gamma", to: "Delta"}, // {from: "Delta", to: "Alpha"} // ] // ); myDiagram.model = new go.GraphLinksModel(keynode, mapnode); } /*]]>*/ </script> </head> <body onload="init()"> <div id="sample"> <div id="myDiagramDiv" style="border: solid 1px black; 800px; height:800px"></div> </div> </body> </html>
后台代码:
package com.thunisoft.maybeemanagementcenter.controller; import com.fasterxml.jackson.core.JsonProcessingException; import com.thunisoft.maybeemanagementcenter.pojo.LinkMap; import com.thunisoft.maybeemanagementcenter.pojo.LinkNode; import com.thunisoft.maybeemanagementcenter.util.JsonHelper; import com.thunisoft.maybeemanagementcenter.util.JsonStrUltil; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.RequestMapping; import java.util.ArrayList; import java.util.List; @Controller @RequestMapping("/sleuth") public class SleuthController { /** * */ @GetMapping("/index") public String index(Model model) { List<LinkNode> nodekey = new ArrayList<>(); nodekey.add(new LinkNode("a")); nodekey.add(new LinkNode("b")); nodekey.add(new LinkNode("c")); nodekey.add(new LinkNode("d")); List<LinkMap> nodemap = new ArrayList<>(); nodemap.add(new LinkMap("a", "b")); nodemap.add(new LinkMap("a", "c")); nodemap.add(new LinkMap("c", "d")); nodemap.add(new LinkMap("d", "a")); JsonHelper jm = new JsonHelper(); String nodekeyjson = null; String nodemapjson = null; try { nodekeyjson = jm.toJson(nodekey); nodemapjson = jm.toJson(nodemap); } catch (JsonProcessingException e) { e.printStackTrace(); } model.addAttribute("nodekey", nodekeyjson); model.addAttribute("nodemap", nodemapjson); return "link"; } }
pojo:
package com.thunisoft.maybeemanagementcenter.pojo; /** * 链路中节点 */ public class LinkNode { private String key; private String color = "lightblue"; /*背景颜色,默认亮蓝色*/ public LinkNode(String key) { this.key = key; } public LinkNode(String key, String color) { this.key = key; this.color = color; } public String getKey() { return key; } public void setKey(String key) { this.key = key; } public String getColor() { return color; } public void setColor(String color) { this.color = color; } }
package com.thunisoft.maybeemanagementcenter.pojo; /** * 链路之间节点映射 */ public class LinkMap { private String from; private String to; public LinkMap(String from, String to) { this.from = from; this.to = to; } public String getFrom() { return from; } public void setFrom(String from) { this.from = from; } public String getTo() { return to; } public void setTo(String to) { this.to = to; } }