"이상훈"의 두 판 사이의 차이
DH 교육용 위키
(새 문서: d) |
|||
| 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> | ||
| + | </body> | ||
| + | </html> | ||
2022년 6월 17일 (금) 14:43 판
<!DOCTYPE html>
vis.js
깃허브예시
</body>
</html>
