demoTViz.html 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <?xml version="1.0" encoding="UTF-8" ?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <title>T-Viz (Trust Visualisation)</title>
  6. <script type="text/javascript" src="CertainTrust.js"></script>
  7. <script type="text/javascript" src="certainTrustTViz.js"></script>
  8. <link rel="stylesheet" type="text/css" href="certainTrustTViz.css" />
  9. <script type="text/javascript" src="certainTrustHTI.js"></script>
  10. <link rel="stylesheet" type="text/css" href="certainTrustHTI.css" />
  11. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  12. <style>
  13. #certaintrust-tviz-2, #certaintrust-tviz-3 {
  14. float: left;
  15. }
  16. </style>
  17. </head>
  18. <body>
  19. <h1>T-Viz (Trust Visualisation)</h1>
  20. <div id="mytest"></div>
  21. <script type="text/javascript">
  22. var allcts = [
  23. [
  24. new CertainTrustSimple("Lage", 0.139, 0.943, 0.1),
  25. new CertainTrustSimple("Essen", 0.8, 0.4, 0.75)
  26. ], [
  27. new CertainTrust("A", 0.7, 0.5, 0.1, 5),
  28. new CertainTrust("B", 0.4, 0.8, 0.75, 5),
  29. new CertainTrust("C", 0.1, 0.1, 0.55, 5),
  30. new CertainTrust("D", 0.6, 0.4, 0.25, 5),
  31. new CertainTrust("E", 0.9, 0.1, 0.50, 5),
  32. new CertainTrust("F", 0.1, 0.9, 0.10, 5),
  33. /*
  34. new CertainTrust("G", 0.7, 0.5, 0.1, 5),
  35. new CertainTrust("H", 0.4, 0.8, 0.75, 5),
  36. new CertainTrust("I", 0.1, 0.1, 0.95, 5),
  37. new CertainTrust("J", 0.6, 0.4, 0.25, 5),
  38. new CertainTrust("K", 0.9, 0.1, 0.50, 5),
  39. new CertainTrust("L", 0.5, 0.9, 0.10, 5),
  40. new CertainTrust("M", 0.7, 0.5, 0.1, 5),
  41. new CertainTrust("N", 0.4, 0.8, 0.75, 5),
  42. new CertainTrust("O", 0.9, 0.9, 0.95, 5),
  43. new CertainTrust("P", 0.6, 0.4, 0.25, 5),
  44. new CertainTrust("Q", 0.9, 0.7, 0.50, 5),
  45. new CertainTrust("R", 0.3, 0.6, 0.10, 5),
  46. new CertainTrust("S", 0.7, 0.5, 0.1, 5),
  47. new CertainTrust("T", 0.4, 0.8, 0.75, 5),
  48. new CertainTrust("U", 0.1, 0.1, 0.55, 5),
  49. new CertainTrust("V", 0.6, 0.6, 0.25, 5),
  50. new CertainTrust("W", 0.9, 0.3, 0.50, 5),
  51. new CertainTrust("X", 0.6, 0.9, 0.70, 5),
  52. new CertainTrust("Y", 0.7, 0.5, 0.1, 5),
  53. new CertainTrust("Z", 0.4, 0.8, 0.75, 5),
  54. //*/
  55. ]
  56. ];
  57. // beware, reversed order!
  58. new CertainTrustTViz(allcts[1], { canvas: { height: 200, width: 200 }, middle: 'AND' });
  59. new CertainTrustTViz(allcts[0], { canvas: { height: 200, width: 200 }, middle: 'NONE' });
  60. new CertainTrustTViz(allcts[1]);
  61. new CertainTrustTViz(allcts[0], { middle: function(indata) { return (indata[0].getExpectation() < 0.5) ? ":(" : ":)"; },
  62. onClick: function(certainTrust) {
  63. if (certainTrust.getName() === "Lage") document.location = 'https://en.wikipedia.org/wiki/Location_%28geography%29';
  64. else if (certainTrust.getName() === "Essen") alert("Anything is good if it's made of chocolate.");
  65. } });
  66. </script>
  67. <div style="clear:both;"></div>
  68. <script type="text/javascript">
  69. new CertainTrustHTI(allcts[1][5]);
  70. new CertainTrustHTI(allcts[0][1]);
  71. new CertainTrustHTI(allcts[0][0]);
  72. </script>
  73. <a href="javascript:CertainTrustTVizElement.ByNr(3).add(new CertainTrust('Trinken', 0.5, 0.8, 0.6, 10));">ADD Trinken</a>
  74. <a href="javascript:CertainTrustTVizElement.ByNr(3).remove('Trinken');">DEL Trinken</a>
  75. </body>
  76. </html>