|
|
| 1번째 줄: |
1번째 줄: |
| − | <!DOCTYPE html>
| |
| − | <html>
| |
| − | <head>
| |
| − | <meta charset="utf-8">
| |
| − | <title></title>
| |
| − | <script
| |
| − | type="text/javascript"
| |
| − | src="https://unpkg.com/vis-network/standalone/umd/vis-network.min.js"
| |
| − | ></script>
| |
| − |
| |
| − | <style type="text/css">
| |
| − | #mynetwork {
| |
| − | width: 600px;
| |
| − | height: 400px;
| |
| − | border: 1px solid lightgray;
| |
| − | }
| |
| − | </style>
| |
| − | </head>
| |
| − | <body>
| |
| − | <h1>vis.js</h1>
| |
| − | <a href="https://github.com/visjs">깃허브</a><br>
| |
| − | <a href="https://visjs.github.io/vis-network/examples/">예시</a>
| |
| − | <div id="mynetwork"></div>
| |
| − |
| |
| − | <script type="text/javascript">
| |
| − | // create an array with nodes
| |
| − | var nodes = new vis.DataSet([
| |
| − | { id: 1, label: "안성현" },
| |
| − | { id: 2, label: "06" },
| |
| − | { id: 3, label: "한삼고 짱" },
| |
| − | { id: 4, label: "편집 신" },
| |
| − | { id: 5, label: "전교 1등(예정)" },
| |
| − | { id: 6, label: "천재" },
| |
| − | { id: 7, label: "기숙사의 자랑" },
| |
| − | { id: 8, label: "제명호의 자랑" },
| |
| − | { id: 9, label: "권찬솔" },
| |
| − | { id: 10, label: "기숙사층장" },
| |
| − | { id: 11, label: "사람" },
| |
| − | ]);
| |
| − |
| |
| − | // create an array with edges
| |
| − | var edges = new vis.DataSet([
| |
| − | { from: 1, to: 2 },
| |
| − | { from: 1, to: 3 },
| |
| − | { from: 1, to: 4 },
| |
| − | { from: 1, to: 5 },
| |
| − | { from: 1, to: 6 },
| |
| − | { from: 1, to: 7 },
| |
| − | { from: 7, to: 8 },
| |
| − | { from: 8, to: 9 },
| |
| − | { from: 10, to: 9 },
| |
| − | { from: 11, to: 9 },
| |
| − | ]);
| |
| − |
| |
| − | // create a network
| |
| − | var container = document.getElementById("mynetwork");
| |
| − | var data = {
| |
| − | nodes: nodes,
| |
| − | edges: edges,
| |
| − | };
| |
| − | var options = {};
| |
| − | var network = new vis.Network(container, data, options);
| |
| − | </script>
| |
| − | </body>
| |
| − | </html>
| |
| − |
| |
| | <pre> | | <pre> |
| | | | |
2022년 6월 17일 (금) 15:07 판
#Class
person green circle
place red circle
event blue circle
#Relation
loves
happens
meets
#Nodes
상훈 person 상훈
아이유 person 아이유
#Links
상훈 아이유 meets
아이유 상훈 happens
#End
