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.

perception-systeme-visuel-marques-et-canaux-couleurs.html 14KB

5 years ago
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang="">
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6. <title>Chapitre 3 Perception : système visuel, marques et canaux, couleurs | Visualisation de données : éléments théoriques et applications avec R</title>
  7. <meta name="description" content="Cours introductif à la visualisation de données avec R. Ce cours a pour but d introduire les concepts théoriques de base en visualisation ainsi que des exemples concrets." />
  8. <meta name="generator" content="bookdown 0.12 and GitBook 2.6.7" />
  9. <meta property="og:title" content="Chapitre 3 Perception : système visuel, marques et canaux, couleurs | Visualisation de données : éléments théoriques et applications avec R" />
  10. <meta property="og:type" content="book" />
  11. <meta property="og:description" content="Cours introductif à la visualisation de données avec R. Ce cours a pour but d introduire les concepts théoriques de base en visualisation ainsi que des exemples concrets." />
  12. <meta name="twitter:card" content="summary" />
  13. <meta name="twitter:title" content="Chapitre 3 Perception : système visuel, marques et canaux, couleurs | Visualisation de données : éléments théoriques et applications avec R" />
  14. <meta name="twitter:description" content="Cours introductif à la visualisation de données avec R. Ce cours a pour but d introduire les concepts théoriques de base en visualisation ainsi que des exemples concrets." />
  15. <meta name="author" content="Antoine Neuraz" />
  16. <meta name="date" content="2019-10-30" />
  17. <meta name="viewport" content="width=device-width, initial-scale=1" />
  18. <meta name="apple-mobile-web-app-capable" content="yes" />
  19. <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  20. <link rel="prev" href="types-de-datasets-et-types-de-donnees.html">
  21. <link rel="next" href="abstraction-de-tache.html">
  22. <script src="libs/jquery-2.2.3/jquery.min.js"></script>
  23. <link href="libs/gitbook-2.6.7/css/style.css" rel="stylesheet" />
  24. <link href="libs/gitbook-2.6.7/css/plugin-table.css" rel="stylesheet" />
  25. <link href="libs/gitbook-2.6.7/css/plugin-bookdown.css" rel="stylesheet" />
  26. <link href="libs/gitbook-2.6.7/css/plugin-highlight.css" rel="stylesheet" />
  27. <link href="libs/gitbook-2.6.7/css/plugin-search.css" rel="stylesheet" />
  28. <link href="libs/gitbook-2.6.7/css/plugin-fontsettings.css" rel="stylesheet" />
  29. <link rel="stylesheet" href="style.css" type="text/css" />
  30. </head>
  31. <body>
  32. <div class="book without-animation with-summary font-size-2 font-family-1" data-basepath=".">
  33. <div class="book-summary">
  34. <nav role="navigation">
  35. <ul class="summary">
  36. <li><a href="./">Visualisation de données : éléments théoriques et applications avec R</a></li>
  37. <li class="divider"></li>
  38. <li class="chapter" data-level="" data-path="index.html"><a href="index.html"><i class="fa fa-check"></i>Prerequis</a><ul>
  39. <li class="chapter" data-level="" data-path="index.html"><a href="index.html#installer-r"><i class="fa fa-check"></i>Installer R</a></li>
  40. <li class="chapter" data-level="" data-path="index.html"><a href="index.html#installer-rstudio-facultatif"><i class="fa fa-check"></i>Installer RStudio (facultatif)</a></li>
  41. <li class="chapter" data-level="" data-path="index.html"><a href="index.html#installer-les-packages-necessaires"><i class="fa fa-check"></i>Installer les packages nécessaires</a></li>
  42. </ul></li>
  43. <li class="chapter" data-level="1" data-path="intro.html"><a href="intro.html"><i class="fa fa-check"></i><b>1</b> Intro</a><ul>
  44. <li class="chapter" data-level="1.1" data-path="intro.html"><a href="intro.html#section"><i class="fa fa-check"></i><b>1.1</b> </a></li>
  45. <li class="chapter" data-level="1.2" data-path="intro.html"><a href="intro.html#mappings-in-ggplot"><i class="fa fa-check"></i><b>1.2</b> Mappings in ggplot</a></li>
  46. <li class="chapter" data-level="1.3" data-path="intro.html"><a href="intro.html#scales-in-ggplot"><i class="fa fa-check"></i><b>1.3</b> scales in ggplot</a></li>
  47. </ul></li>
  48. <li class="chapter" data-level="2" data-path="types-de-datasets-et-types-de-donnees.html"><a href="types-de-datasets-et-types-de-donnees.html"><i class="fa fa-check"></i><b>2</b> Types de datasets et types de données</a><ul>
  49. <li class="chapter" data-level="2.1" data-path="types-de-datasets-et-types-de-donnees.html"><a href="types-de-datasets-et-types-de-donnees.html#types-de-datasets"><i class="fa fa-check"></i><b>2.1</b> Types de datasets</a><ul>
  50. <li class="chapter" data-level="2.1.1" data-path="types-de-datasets-et-types-de-donnees.html"><a href="types-de-datasets-et-types-de-donnees.html#donnees-tabulaires"><i class="fa fa-check"></i><b>2.1.1</b> Données tabulaires</a></li>
  51. <li class="chapter" data-level="2.1.2" data-path="types-de-datasets-et-types-de-donnees.html"><a href="types-de-datasets-et-types-de-donnees.html#todo"><i class="fa fa-check"></i><b>2.1.2</b> TODO</a></li>
  52. </ul></li>
  53. <li class="chapter" data-level="2.2" data-path="types-de-datasets-et-types-de-donnees.html"><a href="types-de-datasets-et-types-de-donnees.html#types-de-donnees"><i class="fa fa-check"></i><b>2.2</b> Types de données</a><ul>
  54. <li class="chapter" data-level="2.2.1" data-path="types-de-datasets-et-types-de-donnees.html"><a href="types-de-datasets-et-types-de-donnees.html#todo-1"><i class="fa fa-check"></i><b>2.2.1</b> TODO</a></li>
  55. </ul></li>
  56. </ul></li>
  57. <li class="chapter" data-level="3" data-path="perception-systeme-visuel-marques-et-canaux-couleurs.html"><a href="perception-systeme-visuel-marques-et-canaux-couleurs.html"><i class="fa fa-check"></i><b>3</b> Perception : système visuel, marques et canaux, couleurs</a><ul>
  58. <li class="chapter" data-level="3.1" data-path="perception-systeme-visuel-marques-et-canaux-couleurs.html"><a href="perception-systeme-visuel-marques-et-canaux-couleurs.html#todo-2"><i class="fa fa-check"></i><b>3.1</b> TODO</a></li>
  59. <li class="chapter" data-level="3.2" data-path="perception-systeme-visuel-marques-et-canaux-couleurs.html"><a href="perception-systeme-visuel-marques-et-canaux-couleurs.html#types-de-marques"><i class="fa fa-check"></i><b>3.2</b> Types de marques</a></li>
  60. <li class="chapter" data-level="3.3" data-path="perception-systeme-visuel-marques-et-canaux-couleurs.html"><a href="perception-systeme-visuel-marques-et-canaux-couleurs.html#mappings-in-ggplot-1"><i class="fa fa-check"></i><b>3.3</b> Mappings in ggplot</a></li>
  61. <li class="chapter" data-level="3.4" data-path="perception-systeme-visuel-marques-et-canaux-couleurs.html"><a href="perception-systeme-visuel-marques-et-canaux-couleurs.html#scales-in-ggplot-1"><i class="fa fa-check"></i><b>3.4</b> scales in ggplot</a></li>
  62. </ul></li>
  63. <li class="chapter" data-level="4" data-path="abstraction-de-tache.html"><a href="abstraction-de-tache.html"><i class="fa fa-check"></i><b>4</b> Abstraction de tâche</a><ul>
  64. <li class="chapter" data-level="4.1" data-path="abstraction-de-tache.html"><a href="abstraction-de-tache.html#todo-3"><i class="fa fa-check"></i><b>4.1</b> TODO</a></li>
  65. </ul></li>
  66. <li class="chapter" data-level="5" data-path="principes-de-design.html"><a href="principes-de-design.html"><i class="fa fa-check"></i><b>5</b> Principes de design</a><ul>
  67. <li class="chapter" data-level="5.1" data-path="principes-de-design.html"><a href="principes-de-design.html#todo-4"><i class="fa fa-check"></i><b>5.1</b> TODO</a></li>
  68. </ul></li>
  69. <li class="chapter" data-level="6" data-path="visualisation-de-donnees-tabulaires.html"><a href="visualisation-de-donnees-tabulaires.html"><i class="fa fa-check"></i><b>6</b> Visualisation de données tabulaires</a><ul>
  70. <li class="chapter" data-level="6.1" data-path="visualisation-de-donnees-tabulaires.html"><a href="visualisation-de-donnees-tabulaires.html#todo-5"><i class="fa fa-check"></i><b>6.1</b> TODO</a></li>
  71. </ul></li>
  72. <li class="chapter" data-level="7" data-path="interaction.html"><a href="interaction.html"><i class="fa fa-check"></i><b>7</b> Interaction</a><ul>
  73. <li class="chapter" data-level="7.1" data-path="interaction.html"><a href="interaction.html#todo-6"><i class="fa fa-check"></i><b>7.1</b> TODO</a></li>
  74. </ul></li>
  75. <li class="chapter" data-level="8" data-path="visualisation-de-donnees-spatiales.html"><a href="visualisation-de-donnees-spatiales.html"><i class="fa fa-check"></i><b>8</b> Visualisation de données spatiales</a><ul>
  76. <li class="chapter" data-level="8.1" data-path="visualisation-de-donnees-spatiales.html"><a href="visualisation-de-donnees-spatiales.html#todo-7"><i class="fa fa-check"></i><b>8.1</b> TODO</a></li>
  77. </ul></li>
  78. <li class="chapter" data-level="9" data-path="visualisation-de-reseaux-et-graphes.html"><a href="visualisation-de-reseaux-et-graphes.html"><i class="fa fa-check"></i><b>9</b> Visualisation de réseaux et graphes</a></li>
  79. <li class="chapter" data-level="10" data-path="visualisation-de-texte.html"><a href="visualisation-de-texte.html"><i class="fa fa-check"></i><b>10</b> Visualisation de texte</a><ul>
  80. <li class="chapter" data-level="10.1" data-path="visualisation-de-texte.html"><a href="visualisation-de-texte.html#todo-8"><i class="fa fa-check"></i><b>10.1</b> TODO</a></li>
  81. </ul></li>
  82. <li class="chapter" data-level="11" data-path="visualisation-de-texte-1.html"><a href="visualisation-de-texte-1.html"><i class="fa fa-check"></i><b>11</b> Visualisation de texte</a><ul>
  83. <li class="chapter" data-level="11.1" data-path="visualisation-de-texte-1.html"><a href="visualisation-de-texte-1.html#todo-9"><i class="fa fa-check"></i><b>11.1</b> TODO</a></li>
  84. </ul></li>
  85. <li class="chapter" data-level="12" data-path="ggplot2-techniques-avancees.html"><a href="ggplot2-techniques-avancees.html"><i class="fa fa-check"></i><b>12</b> <code>ggplot2</code> : techniques avancées</a><ul>
  86. <li class="chapter" data-level="12.1" data-path="ggplot2-techniques-avancees.html"><a href="ggplot2-techniques-avancees.html#creer-son-propre-theme-ggplot2"><i class="fa fa-check"></i><b>12.1</b> Créer son propre thème <code>ggplot2</code></a><ul>
  87. <li class="chapter" data-level="12.1.1" data-path="ggplot2-techniques-avancees.html"><a href="ggplot2-techniques-avancees.html#un-theme-est-une-fonction"><i class="fa fa-check"></i><b>12.1.1</b> un thème est une fonction</a></li>
  88. <li class="chapter" data-level="12.1.2" data-path="ggplot2-techniques-avancees.html"><a href="ggplot2-techniques-avancees.html#modifier-un-theme-de-base-avec-replace"><i class="fa fa-check"></i><b>12.1.2</b> modifier un thème de base avec <code>%+replace%</code></a></li>
  89. <li class="chapter" data-level="12.1.3" data-path="ggplot2-techniques-avancees.html"><a href="ggplot2-techniques-avancees.html#definir-de-nouveaux-attributs"><i class="fa fa-check"></i><b>12.1.3</b> définir de nouveaux attributs</a></li>
  90. <li class="chapter" data-level="12.1.4" data-path="ggplot2-techniques-avancees.html"><a href="ggplot2-techniques-avancees.html#exemple"><i class="fa fa-check"></i><b>12.1.4</b> Exemple</a></li>
  91. </ul></li>
  92. <li class="chapter" data-level="12.2" data-path="ggplot2-techniques-avancees.html"><a href="ggplot2-techniques-avancees.html#utiliser-ggplot2-dans-des-fonctions"><i class="fa fa-check"></i><b>12.2</b> Utiliser <code>ggplot2</code> dans des fonctions</a></li>
  93. </ul></li>
  94. <li class="chapter" data-level="" data-path="references.html"><a href="references.html"><i class="fa fa-check"></i>References</a></li>
  95. <li class="divider"></li>
  96. <li><a href="https://github.com/rstudio/bookdown" target="blank">Published with bookdown</a></li>
  97. </ul>
  98. </nav>
  99. </div>
  100. <div class="book-body">
  101. <div class="body-inner">
  102. <div class="book-header" role="navigation">
  103. <h1>
  104. <i class="fa fa-circle-o-notch fa-spin"></i><a href="./">Visualisation de données : éléments théoriques et applications avec R</a>
  105. </h1>
  106. </div>
  107. <div class="page-wrapper" tabindex="-1" role="main">
  108. <div class="page-inner">
  109. <section class="normal" id="section-">
  110. <div id="perception-systeme-visuel-marques-et-canaux-couleurs" class="section level1">
  111. <h1><span class="header-section-number">Chapitre 3</span> Perception : système visuel, marques et canaux, couleurs</h1>
  112. <div id="todo-2" class="section level2">
  113. <h2><span class="header-section-number">3.1</span> TODO</h2>
  114. </div>
  115. <div id="types-de-marques" class="section level2">
  116. <h2><span class="header-section-number">3.2</span> Types de marques</h2>
  117. <div class="figure" style="text-align: center"><span id="fig:encode"></span>
  118. <img src="dataviz_files/figure-html/encode-1.png" alt="Exemples d'encodage" width="672" />
  119. <p class="caption">
  120. Figure 3.1: Exemples d’encodage
  121. </p>
  122. </div>
  123. </div>
  124. <div id="mappings-in-ggplot-1" class="section level2">
  125. <h2><span class="header-section-number">3.3</span> Mappings in ggplot</h2>
  126. <p><img src="dataviz_files/figure-html/unnamed-chunk-10-1.png" width="672" /></p>
  127. <p>figure from <a href="">https://serialmentor.com/dataviz/aesthetic-mapping.html</a></p>
  128. </div>
  129. <div id="scales-in-ggplot-1" class="section level2">
  130. <h2><span class="header-section-number">3.4</span> scales in ggplot</h2>
  131. <p><img src="dataviz_files/figure-html/unnamed-chunk-11-1.png" width="672" /></p>
  132. <p>figure from <a href="">https://serialmentor.com/dataviz/aesthetic-mapping.html</a></p>
  133. </div>
  134. </div>
  135. </section>
  136. </div>
  137. </div>
  138. </div>
  139. <a href="types-de-datasets-et-types-de-donnees.html" class="navigation navigation-prev " aria-label="Previous page"><i class="fa fa-angle-left"></i></a>
  140. <a href="abstraction-de-tache.html" class="navigation navigation-next " aria-label="Next page"><i class="fa fa-angle-right"></i></a>
  141. </div>
  142. </div>
  143. <script src="libs/gitbook-2.6.7/js/app.min.js"></script>
  144. <script src="libs/gitbook-2.6.7/js/lunr.js"></script>
  145. <script src="libs/gitbook-2.6.7/js/plugin-search.js"></script>
  146. <script src="libs/gitbook-2.6.7/js/plugin-sharing.js"></script>
  147. <script src="libs/gitbook-2.6.7/js/plugin-fontsettings.js"></script>
  148. <script src="libs/gitbook-2.6.7/js/plugin-bookdown.js"></script>
  149. <script src="libs/gitbook-2.6.7/js/jquery.highlight.js"></script>
  150. <script>
  151. gitbook.require(["gitbook"], function(gitbook) {
  152. gitbook.start({
  153. "sharing": {
  154. "github": false,
  155. "facebook": true,
  156. "twitter": true,
  157. "google": false,
  158. "linkedin": false,
  159. "weibo": false,
  160. "instapaper": false,
  161. "vk": false,
  162. "all": ["facebook", "google", "twitter", "linkedin", "weibo", "instapaper"]
  163. },
  164. "fontsettings": {
  165. "theme": "white",
  166. "family": "sans",
  167. "size": 2
  168. },
  169. "edit": {
  170. "link": null,
  171. "text": null
  172. },
  173. "history": {
  174. "link": null,
  175. "text": null
  176. },
  177. "download": ["dataviz.pdf", "dataviz.epub"],
  178. "toc": {
  179. "collapse": "subsection"
  180. }
  181. });
  182. });
  183. </script>
  184. </body>
  185. </html>