5 роки тому
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259
  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang="">
  3. <head>
  4. <title>Cours 07 - Données temporelles et textuelles</title>
  5. <meta charset="utf-8" />
  6. <meta name="author" content="Antoine Neuraz" />
  7. <link href="libs/remark-css-0.0.1/default.css" rel="stylesheet" />
  8. <link rel="stylesheet" href="css/my_style.css" type="text/css" />
  9. </head>
  10. <body>
  11. <textarea id="source">
  12. ---
  13. class: center, full
  14. ![](img/seismes.png)
  15. [https://frama.link/viz-seismes]()
  16. ---
  17. class: center, middle, inverse
  18. # Visualisation de données textuelles
  19. ---
  20. class: center
  21. ## Données textuelles ?
  22. ![:scale 90%](img/textual_data_levels.png)
  23. ---
  24. class:center, middle
  25. # Taille
  26. ---
  27. class: center
  28. ## Word cloud
  29. ![](img/wordcloud.png)
  30. ---
  31. ## Word cloud plus analytique
  32. ![](img/word_cloud_analytic.png)
  33. ---
  34. ## Bubble cloud
  35. ![](img/bubblecloud.png)
  36. [Bubble Cloud](https://archive.nytimes.com/www.nytimes.com/interactive/2012/09/06/us/politics/convention-word-counts.html)
  37. ---
  38. class: center, middle
  39. # Position
  40. ---
  41. ## Text arc by Bradford Paley
  42. ![](img/textarc.png)
  43. [version Interactive](https://vallandingham.me/textarc/)
  44. ---
  45. ## Stereotropes
  46. ![:scale 85%](img/stereotropes.png)
  47. [stereotropes](http://stereotropes.bocoup.com/gender)
  48. ---
  49. ## Wordwanderer
  50. ![](img/wordwanderer.png)
  51. [http://wordwanderer.org/]()
  52. ---
  53. class: center, middle
  54. # Structure
  55. ---
  56. ## Concordance
  57. ![](img/concordanceplot.png)
  58. [Quick concordance plot](https://vallandingham.me/concordance_plot/)
  59. ---
  60. ## Fingerprint
  61. ![:scale 85%](img/fingerprints.png)
  62. [litterature fingerprints](https://kops.uni-konstanz.de/bitstream/handle/123456789/5492/Literature_Fingerprinting.pdf)
  63. ---
  64. ## Word tree
  65. ![](img/word_tree.png)
  66. [Word tree](https://www.jasondavies.com/wordtree/?source=alice-in-wonderland.txt&amp;prefix=alice%20to)
  67. ---
  68. ## Origins of species
  69. ![](img/origins_species.png)
  70. [https://fathom.info/traces/]()
  71. ---
  72. class: center
  73. ## Dissertation browser
  74. ![:scale 70%](img/dissertation.png)
  75. [Dissertation browser](https://www-nlp.stanford.edu/projects/dissertations/browser.html)
  76. ---
  77. ## Literary Organism
  78. ![](img/litterary.png)
  79. ---
  80. ## Sentence drawing
  81. ![](img/sentence_drawing.png)
  82. [sentence drawings](https://vallandingham.me/sentence_drawings/#1984)
  83. ---
  84. class: center, middle, inverse
  85. # Visualisation de données temporelles
  86. ---
  87. class: full, center
  88. ![:abs 100%, 0, 0](img/Night_Photography.jpg)
  89. ---
  90. ## Bien sur: le line chart
  91. ![](img/playfair.png)
  92. ---
  93. ## ou encore : Minard
  94. ![](img/minard.png)
  95. ---
  96. ## Rose diagram (polar area)
  97. ![](img/nightingale.png)
  98. #### Nightingale (1856)
  99. ---
  100. ## Heatmap
  101. ![:scale 80%](img/trulia.png)
  102. [interactive](https://visual.ly/community/interactive-graphic/business/house-hunting)
  103. ---
  104. ## Gapminder
  105. &lt;iframe width="800" height="400" src="https://www.youtube.com/embed/BPt8ElTQMIg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen&gt;&lt;/iframe&gt;
  106. </textarea>
  107. <style data-target="print-only">@media screen {.remark-slide-container{display:block;}.remark-slide-scaler{box-shadow:none;}}</style>
  108. <script src="https://remarkjs.com/downloads/remark-latest.min.js"></script>
  109. <script src="addons/macros.js"></script>
  110. <script>var slideshow = remark.create({
  111. "ratio": "4:3",
  112. "countIncrementalSlides": false,
  113. "self-contained": true
  114. });
  115. if (window.HTMLWidgets) slideshow.on('afterShowSlide', function (slide) {
  116. window.dispatchEvent(new Event('resize'));
  117. });
  118. (function(d) {
  119. var s = d.createElement("style"), r = d.querySelector(".remark-slide-scaler");
  120. if (!r) return;
  121. s.type = "text/css"; s.innerHTML = "@page {size: " + r.style.width + " " + r.style.height +"; }";
  122. d.head.appendChild(s);
  123. })(document);
  124. (function(d) {
  125. var el = d.getElementsByClassName("remark-slides-area");
  126. if (!el) return;
  127. var slide, slides = slideshow.getSlides(), els = el[0].children;
  128. for (var i = 1; i < slides.length; i++) {
  129. slide = slides[i];
  130. if (slide.properties.continued === "true" || slide.properties.count === "false") {
  131. els[i - 1].className += ' has-continuation';
  132. }
  133. }
  134. var s = d.createElement("style");
  135. s.type = "text/css"; s.innerHTML = "@media print { .has-continuation { display: none; } }";
  136. d.head.appendChild(s);
  137. })(document);
  138. // delete the temporary CSS (for displaying all slides initially) when the user
  139. // starts to view slides
  140. (function() {
  141. var deleted = false;
  142. slideshow.on('beforeShowSlide', function(slide) {
  143. if (deleted) return;
  144. var sheets = document.styleSheets, node;
  145. for (var i = 0; i < sheets.length; i++) {
  146. node = sheets[i].ownerNode;
  147. if (node.dataset["target"] !== "print-only") continue;
  148. node.parentNode.removeChild(node);
  149. }
  150. deleted = true;
  151. });
  152. })();</script>
  153. <script>
  154. (function() {
  155. var links = document.getElementsByTagName('a');
  156. for (var i = 0; i < links.length; i++) {
  157. if (/^(https?:)?\/\//.test(links[i].getAttribute('href'))) {
  158. links[i].target = '_blank';
  159. }
  160. }
  161. })();
  162. </script>
  163. <script>
  164. slideshow._releaseMath = function(el) {
  165. var i, text, code, codes = el.getElementsByTagName('code');
  166. for (i = 0; i < codes.length;) {
  167. code = codes[i];
  168. if (code.parentNode.tagName !== 'PRE' && code.childElementCount === 0) {
  169. text = code.textContent;
  170. if (/^\\\((.|\s)+\\\)$/.test(text) || /^\\\[(.|\s)+\\\]$/.test(text) ||
  171. /^\$\$(.|\s)+\$\$$/.test(text) ||
  172. /^\\begin\{([^}]+)\}(.|\s)+\\end\{[^}]+\}$/.test(text)) {
  173. code.outerHTML = code.innerHTML; // remove <code></code>
  174. continue;
  175. }
  176. }
  177. i++;
  178. }
  179. };
  180. slideshow._releaseMath(document);
  181. </script>
  182. <!-- dynamically load mathjax for compatibility with self-contained -->
  183. <script>
  184. (function () {
  185. var script = document.createElement('script');
  186. script.type = 'text/javascript';
  187. script.src = 'https://mathjax.rstudio.com/latest/MathJax.js?config=TeX-MML-AM_CHTML';
  188. if (location.protocol !== 'file:' && /^https?:/.test(script.src))
  189. script.src = script.src.replace(/^https?:/, '');
  190. document.getElementsByTagName('head')[0].appendChild(script);
  191. })();
  192. </script>
  193. </body>
  194. </html>