metadata.html 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Privacy Policy</title>
  6. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  7. <link rel='stylesheet prefetch' href='https://fperucic.github.io/treant-js/Treant.css'>
  8. <body>
  9. <div>
  10. <div id="metadata" style="height: 1500px; margin: 5px; width: auto;"> </div>
  11. </div>
  12. <script src="https://fperucic.github.io/treant-js/Treant.js"></script>
  13. <script src="https://fperucic.github.io/treant-js/vendor/raphael.js"></script>
  14. <script type="text/javascript">
  15. var simple_chart_config = {
  16. chart: {
  17. container: "#metadata",
  18. rootOrientation: "WEST",
  19. levelSeparation: 50,
  20. siblingSeparation: 25,
  21. subTeeSeparation: 25,
  22. connectors: {
  23. // type: "step",
  24. style: {
  25. "stroke-width": 2
  26. }
  27. },
  28. },
  29. connectors: {
  30. type: "straight",
  31. style: {
  32. "stroke-width": 2,
  33. "stroke": "#ccc"
  34. }
  35. },
  36. nodeStructure: {
  37. text: { name: "Policy" },
  38. children: [
  39. {
  40. text: { name: "Data Collection" },
  41. children: [
  42. {
  43. text: { name: "source" },
  44. children: [
  45. {
  46. text: { name: "Data Subject" },
  47. },
  48. {
  49. text: { name: "Third Party" },
  50. },
  51. ]
  52. },
  53. {
  54. text: { name: "legal basis" },
  55. children: [
  56. {
  57. text: { name: "legitimate interest" }
  58. },
  59. {
  60. text: { name: "opt-in/voluntary" }
  61. }
  62. ]
  63. },
  64. {
  65. text: { name: "collection mechanism" },
  66. children: [
  67. {
  68. text: { name: "given by user" }
  69. },
  70. {
  71. text: { name: "automatic" }
  72. }
  73. ]
  74. }
  75. ]
  76. },
  77. {
  78. text: { name: "Data Usage" },
  79. children: [
  80. {
  81. text: { name: "provide security" }
  82. },
  83. {
  84. text: { name: "legal obligations" }
  85. },
  86. {
  87. text: { name: "for Services" },
  88. children: [
  89. {
  90. text: { name: "develop" }
  91. },
  92. {
  93. text: { name: "provide" }
  94. },
  95. {
  96. text: { name: "improve" }
  97. }
  98. ]
  99. },
  100. {
  101. text: { name: "analytics" }
  102. },
  103. {
  104. text: { name: "marketing" }
  105. },
  106. {
  107. text: { name: "Payments Controller" }
  108. }
  109. ]
  110. },
  111. {
  112. text: { name: "Data Sharing" },
  113. children: [
  114. {
  115. text: { name: "choice" },
  116. children: [
  117. {
  118. text: { name: "given consent" },
  119. },
  120. {
  121. text: { name: "legitimate interest"}
  122. }
  123. ]
  124. },
  125. {
  126. text: { name: "party" },
  127. children: [
  128. {
  129. text: { name: "other users" }
  130. },
  131. {
  132. text: { name: "public profile" }
  133. },
  134. {
  135. text: { name: "third-party"},
  136. children: [
  137. {
  138. text: { name: "selected by Host" }
  139. },
  140. {
  141. text: { name: "business partners" }
  142. }
  143. ]
  144. }
  145. ]
  146. }
  147. ]
  148. }
  149. ]
  150. }
  151. };
  152. $(document).ready(function() {
  153. new Treant(simple_chart_config);
  154. });
  155. </script>
  156. </body>
  157. </html>