vis.js is a dynamic, browser-based visualization library
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

386 lines
15 KiB

  1. <!doctype html>
  2. <html>
  3. <head>
  4. <title>Network | Les miserables</title>
  5. <style type="text/css">
  6. #mynetwork {
  7. width: 900px;
  8. height: 900px;
  9. border: 1px solid lightgray;
  10. }
  11. </style>
  12. <script type="text/javascript" src="../../dist/vis.js"></script>
  13. <link href="../../dist/vis.css" rel="stylesheet" type="text/css" />
  14. <script type="text/javascript">
  15. function draw() {
  16. // create some nodes
  17. var nodes = [
  18. {id:0,"label":"Myriel","group":1},
  19. {id:1,"label":"Napoleon","group":1},
  20. {id:2,"label":"Mlle.Baptistine","group":1},
  21. {id:3,"label":"Mme.Magloire","group":1},
  22. {id:4,"label":"CountessdeLo","group":1},
  23. {id:5,"label":"Geborand","group":1},
  24. {id:6,"label":"Champtercier","group":1},
  25. {id:7,"label":"Cravatte","group":1},
  26. {id:8,"label":"Count","group":1},
  27. {id:9,"label":"OldMan","group":1},
  28. {id:10,"label":"Labarre","group":2},
  29. {id:11,"label":"Valjean","group":2},
  30. {id:12,"label":"Marguerite","group":3},
  31. {id:13,"label":"Mme.deR","group":2},
  32. {id:14,"label":"Isabeau","group":2},
  33. {id:15,"label":"Gervais","group":2},
  34. {id:16,"label":"Tholomyes","group":3},
  35. {id:17,"label":"Listolier","group":3},
  36. {id:18,"label":"Fameuil","group":3},
  37. {id:19,"label":"Blacheville","group":3},
  38. {id:20,"label":"Favourite","group":3},
  39. {id:21,"label":"Dahlia","group":3},
  40. {id:22,"label":"Zephine","group":3},
  41. {id:23,"label":"Fantine","group":3},
  42. {id:24,"label":"Mme.Thenardier","group":4},
  43. {id:25,"label":"Thenardier","group":4},
  44. {id:26,"label":"Cosette","group":5},
  45. {id:27,"label":"Javert","group":4},
  46. {id:28,"label":"Fauchelevent","group":0},
  47. {id:29,"label":"Bamatabois","group":2},
  48. {id:30,"label":"Perpetue","group":3},
  49. {id:31,"label":"Simplice","group":2},
  50. {id:32,"label":"Scaufflaire","group":2},
  51. {id:33,"label":"Woman1","group":2},
  52. {id:34,"label":"Judge","group":2},
  53. {id:35,"label":"Champmathieu","group":2},
  54. {id:36,"label":"Brevet","group":2},
  55. {id:37,"label":"Chenildieu","group":2},
  56. {id:38,"label":"Cochepaille","group":2},
  57. {id:39,"label":"Pontmercy","group":4},
  58. {id:40,"label":"Boulatruelle","group":6},
  59. {id:41,"label":"Eponine","group":4},
  60. {id:42,"label":"Anzelma","group":4},
  61. {id:43,"label":"Woman2","group":5},
  62. {id:44,"label":"MotherInnocent","group":0},
  63. {id:45,"label":"Gribier","group":0},
  64. {id:46,"label":"Jondrette","group":7},
  65. {id:47,"label":"Mme.Burgon","group":7},
  66. {id:48,"label":"Gavroche","group":8},
  67. {id:49,"label":"Gillenormand","group":5},
  68. {id:50,"label":"Magnon","group":5},
  69. {id:51,"label":"Mlle.Gillenormand","group":5},
  70. {id:52,"label":"Mme.Pontmercy","group":5},
  71. {id:53,"label":"Mlle.Vaubois","group":5},
  72. {id:54,"label":"Lt.Gillenormand","group":5},
  73. {id:55,"label":"Marius","group":8},
  74. {id:56,"label":"BaronessT","group":5},
  75. {id:57,"label":"Mabeuf","group":8},
  76. {id:58,"label":"Enjolras","group":8},
  77. {id:59,"label":"Combeferre","group":8},
  78. {id:60,"label":"Prouvaire","group":8},
  79. {id:61,"label":"Feuilly","group":8},
  80. {id:62,"label":"Courfeyrac","group":8},
  81. {id:63,"label":"Bahorel","group":8},
  82. {id:64,"label":"Bossuet","group":8},
  83. {id:65,"label":"Joly","group":8},
  84. {id:66,"label":"Grantaire","group":8},
  85. {id:67,"label":"MotherPlutarch","group":9},
  86. {id:68,"label":"Gueulemer","group":4},
  87. {id:69,"label":"Babet","group":4},
  88. {id:70,"label":"Claquesous","group":4},
  89. {id:71,"label":"Montparnasse","group":4},
  90. {id:72,"label":"Toussaint","group":5},
  91. {id:73,"label":"Child1","group":10},
  92. {id:74,"label":"Child2","group":10},
  93. {id:75,"label":"Brujon","group":4},
  94. {id:76,"label":"Mme.Hucheloup","group":8}
  95. ];
  96. // create some edges
  97. var edges = [
  98. {"from":1,"to":0},
  99. {"from":2,"to":0},
  100. {"from":3,"to":0},
  101. {"from":3,"to":2},
  102. {"from":4,"to":0},
  103. {"from":5,"to":0},
  104. {"from":6,"to":0},
  105. {"from":7,"to":0},
  106. {"from":8,"to":0},
  107. {"from":9,"to":0},
  108. {"from":11,"to":10},
  109. {"from":11,"to":3},
  110. {"from":11,"to":2},
  111. {"from":11,"to":0},
  112. {"from":12,"to":11},
  113. {"from":13,"to":11},
  114. {"from":14,"to":11},
  115. {"from":15,"to":11},
  116. {"from":17,"to":16},
  117. {"from":18,"to":16},
  118. {"from":18,"to":17},
  119. {"from":19,"to":16},
  120. {"from":19,"to":17},
  121. {"from":19,"to":18},
  122. {"from":20,"to":16},
  123. {"from":20,"to":17},
  124. {"from":20,"to":18},
  125. {"from":20,"to":19},
  126. {"from":21,"to":16},
  127. {"from":21,"to":17},
  128. {"from":21,"to":18},
  129. {"from":21,"to":19},
  130. {"from":21,"to":20},
  131. {"from":22,"to":16},
  132. {"from":22,"to":17},
  133. {"from":22,"to":18},
  134. {"from":22,"to":19},
  135. {"from":22,"to":20},
  136. {"from":22,"to":21},
  137. {"from":23,"to":16},
  138. {"from":23,"to":17},
  139. {"from":23,"to":18},
  140. {"from":23,"to":19},
  141. {"from":23,"to":20},
  142. {"from":23,"to":21},
  143. {"from":23,"to":22},
  144. {"from":23,"to":12},
  145. {"from":23,"to":11},
  146. {"from":24,"to":23},
  147. {"from":24,"to":11},
  148. {"from":25,"to":24},
  149. {"from":25,"to":23},
  150. {"from":25,"to":11},
  151. {"from":26,"to":24},
  152. {"from":26,"to":11},
  153. {"from":26,"to":16},
  154. {"from":26,"to":25},
  155. {"from":27,"to":11},
  156. {"from":27,"to":23},
  157. {"from":27,"to":25},
  158. {"from":27,"to":24},
  159. {"from":27,"to":26},
  160. {"from":28,"to":11},
  161. {"from":28,"to":27},
  162. {"from":29,"to":23},
  163. {"from":29,"to":27},
  164. {"from":29,"to":11},
  165. {"from":30,"to":23},
  166. {"from":31,"to":30},
  167. {"from":31,"to":11},
  168. {"from":31,"to":23},
  169. {"from":31,"to":27},
  170. {"from":32,"to":11},
  171. {"from":33,"to":11},
  172. {"from":33,"to":27},
  173. {"from":34,"to":11},
  174. {"from":34,"to":29},
  175. {"from":35,"to":11},
  176. {"from":35,"to":34},
  177. {"from":35,"to":29},
  178. {"from":36,"to":34},
  179. {"from":36,"to":35},
  180. {"from":36,"to":11},
  181. {"from":36,"to":29},
  182. {"from":37,"to":34},
  183. {"from":37,"to":35},
  184. {"from":37,"to":36},
  185. {"from":37,"to":11},
  186. {"from":37,"to":29},
  187. {"from":38,"to":34},
  188. {"from":38,"to":35},
  189. {"from":38,"to":36},
  190. {"from":38,"to":37},
  191. {"from":38,"to":11},
  192. {"from":38,"to":29},
  193. {"from":39,"to":25},
  194. {"from":40,"to":25},
  195. {"from":41,"to":24},
  196. {"from":41,"to":25},
  197. {"from":42,"to":41},
  198. {"from":42,"to":25},
  199. {"from":42,"to":24},
  200. {"from":43,"to":11},
  201. {"from":43,"to":26},
  202. {"from":43,"to":27},
  203. {"from":44,"to":28},
  204. {"from":44,"to":11},
  205. {"from":45,"to":28},
  206. {"from":47,"to":46},
  207. {"from":48,"to":47},
  208. {"from":48,"to":25},
  209. {"from":48,"to":27},
  210. {"from":48,"to":11},
  211. {"from":49,"to":26},
  212. {"from":49,"to":11},
  213. {"from":50,"to":49},
  214. {"from":50,"to":24},
  215. {"from":51,"to":49},
  216. {"from":51,"to":26},
  217. {"from":51,"to":11},
  218. {"from":52,"to":51},
  219. {"from":52,"to":39},
  220. {"from":53,"to":51},
  221. {"from":54,"to":51},
  222. {"from":54,"to":49},
  223. {"from":54,"to":26},
  224. {"from":55,"to":51},
  225. {"from":55,"to":49},
  226. {"from":55,"to":39},
  227. {"from":55,"to":54},
  228. {"from":55,"to":26},
  229. {"from":55,"to":11},
  230. {"from":55,"to":16},
  231. {"from":55,"to":25},
  232. {"from":55,"to":41},
  233. {"from":55,"to":48},
  234. {"from":56,"to":49},
  235. {"from":56,"to":55},
  236. {"from":57,"to":55},
  237. {"from":57,"to":41},
  238. {"from":57,"to":48},
  239. {"from":58,"to":55},
  240. {"from":58,"to":48},
  241. {"from":58,"to":27},
  242. {"from":58,"to":57},
  243. {"from":58,"to":11},
  244. {"from":59,"to":58},
  245. {"from":59,"to":55},
  246. {"from":59,"to":48},
  247. {"from":59,"to":57},
  248. {"from":60,"to":48},
  249. {"from":60,"to":58},
  250. {"from":60,"to":59},
  251. {"from":61,"to":48},
  252. {"from":61,"to":58},
  253. {"from":61,"to":60},
  254. {"from":61,"to":59},
  255. {"from":61,"to":57},
  256. {"from":61,"to":55},
  257. {"from":62,"to":55},
  258. {"from":62,"to":58},
  259. {"from":62,"to":59},
  260. {"from":62,"to":48},
  261. {"from":62,"to":57},
  262. {"from":62,"to":41},
  263. {"from":62,"to":61},
  264. {"from":62,"to":60},
  265. {"from":63,"to":59},
  266. {"from":63,"to":48},
  267. {"from":63,"to":62},
  268. {"from":63,"to":57},
  269. {"from":63,"to":58},
  270. {"from":63,"to":61},
  271. {"from":63,"to":60},
  272. {"from":63,"to":55},
  273. {"from":64,"to":55},
  274. {"from":64,"to":62},
  275. {"from":64,"to":48},
  276. {"from":64,"to":63},
  277. {"from":64,"to":58},
  278. {"from":64,"to":61},
  279. {"from":64,"to":60},
  280. {"from":64,"to":59},
  281. {"from":64,"to":57},
  282. {"from":64,"to":11},
  283. {"from":65,"to":63},
  284. {"from":65,"to":64},
  285. {"from":65,"to":48},
  286. {"from":65,"to":62},
  287. {"from":65,"to":58},
  288. {"from":65,"to":61},
  289. {"from":65,"to":60},
  290. {"from":65,"to":59},
  291. {"from":65,"to":57},
  292. {"from":65,"to":55},
  293. {"from":66,"to":64},
  294. {"from":66,"to":58},
  295. {"from":66,"to":59},
  296. {"from":66,"to":62},
  297. {"from":66,"to":65},
  298. {"from":66,"to":48},
  299. {"from":66,"to":63},
  300. {"from":66,"to":61},
  301. {"from":66,"to":60},
  302. {"from":67,"to":57},
  303. {"from":68,"to":25},
  304. {"from":68,"to":11},
  305. {"from":68,"to":24},
  306. {"from":68,"to":27},
  307. {"from":68,"to":48},
  308. {"from":68,"to":41},
  309. {"from":69,"to":25},
  310. {"from":69,"to":68},
  311. {"from":69,"to":11},
  312. {"from":69,"to":24},
  313. {"from":69,"to":27},
  314. {"from":69,"to":48},
  315. {"from":69,"to":41},
  316. {"from":70,"to":25},
  317. {"from":70,"to":69},
  318. {"from":70,"to":68},
  319. {"from":70,"to":11},
  320. {"from":70,"to":24},
  321. {"from":70,"to":27},
  322. {"from":70,"to":41},
  323. {"from":70,"to":58},
  324. {"from":71,"to":27},
  325. {"from":71,"to":69},
  326. {"from":71,"to":68},
  327. {"from":71,"to":70},
  328. {"from":71,"to":11},
  329. {"from":71,"to":48},
  330. {"from":71,"to":41},
  331. {"from":71,"to":25},
  332. {"from":72,"to":26},
  333. {"from":72,"to":27},
  334. {"from":72,"to":11},
  335. {"from":73,"to":48},
  336. {"from":74,"to":48},
  337. {"from":74,"to":73},
  338. {"from":75,"to":69},
  339. {"from":75,"to":68},
  340. {"from":75,"to":25},
  341. {"from":75,"to":48},
  342. {"from":75,"to":41},
  343. {"from":75,"to":70},
  344. {"from":75,"to":71},
  345. {"from":76,"to":64},
  346. {"from":76,"to":65},
  347. {"from":76,"to":66},
  348. {"from":76,"to":63},
  349. {"from":76,"to":62},
  350. {"from":76,"to":48},
  351. {"from":76,"to":58}
  352. ];
  353. // create a network
  354. var container = document.getElementById('mynetwork');
  355. var data = {
  356. nodes: nodes,
  357. edges: edges
  358. };
  359. var options = {
  360. nodes: {
  361. shape: 'dot',
  362. size: 16
  363. },
  364. physics: {
  365. stabilization: false
  366. }
  367. };
  368. var network = new vis.Network(container, data, options);
  369. }
  370. </script>
  371. <script src="../googleAnalytics.js"></script>
  372. </head>
  373. <body onload="draw()">
  374. <p>
  375. Relations between the characters of "Les miserables".
  376. </p>
  377. <div id="mynetwork"></div>
  378. </body>
  379. </html>