Html первые шаги: Первые шаги — html (хтмл) для чайников.

Первые шаги — html (хтмл) для чайников. Оглавление.



Первые шаги — html (хтмл) для чайников. Оглавление.
Главная / Html / Оглавление учебника по Html 

Учебник по Html для чайников — Оглавление

Инструментарий. Основные понятия.

  • Ступенька 1 — «Основной инструментарий, учимся работать руками».
  • Ступенька 2 — «Что такое тэги?».
  • Ступенька 3 — «Обязательные тэги. Зачем телу голова, а голове тело?»

    Простейшие.

  • Ступенька 4 — «Раскрась сам. Изменяем цвет текста».
  • Ступенька 5 — «Как изменять цвет фона страницы. Немного об этике цветов».
  • Ступенька 6 — «Параграфы и DIV. Учимся выравнивать текст».
  • Ступенька 7 — «Что такое заголовки и как задавать размер буковок».
  • Ступенька 8 — «Курсив, жирный текст, подчеркнутый и другие».
  • Ступенька 9 — «Стандартные шрифты. Как прописать свой шрифт».
  • Ступенька 10 — «Что такое путь? Как вставлять картинки».
  • Ступенька 11 — «Что можно сделать с картинкой. Картинка, как фон документа, и т.д.».
  • Ступенька 12 — «О любителе сосисок и принудительном прерывании обтекания текстом картинки».
  • Ступенька 13 — «Ссылка и как с нею бороться».
  • Ступенька 14 — «Ссылка на е-майл. Подсказка к текстовой ссылке».
  • Ступенька 15 — «Может ли картинка быть ссылкой».
  • Ступенька 16 — «Куда податься, на что ссылаться. Новое окно при нажатии на ссылку».
  • Ступенька 17 — «Карты. Как часть картинки сделать ссылкой».
  • Ступенька 18 — «Карты. Как часть картинки сделать ссылкой 2».

  • Ступенька 19 — «Карты. Как часть картинки сделать ссылкой 3».
  • Ступенька 20 — «Закладка. Как сделать ссылку внутри документа».

    Таблицы.

  • Ступенька 21 — «Учимся создавать таблицы».
  • Ступенька 22 — «Учимся создавать таблицы» продолжение.
  • Ступенька 23 — «Таблицы, вертикальное выравнивание (valign)».
  • Ступенька 24 — «Таблицы, учимся растягивать ячейки (rowspan, colspan)».
  • Ступенька 24-2 — «Дополнительная глава. Ответы на домашнее задание».
  • Ступенька 25 — «Таблицы, что такое cellspacing и cellpadding. Что делать с пространством».
  • Ступенька 26 — «Вложенные таблицы и некоторые нюансы».
  • Ступенька 27 — «О рамках таблиц, и брюзжание о таблицах напоследок».
  • Ступенька 28 — «Создаем простой сайт с таблицами».

    Дополнительные.

  • Ступенька 29 — «Спецсимволы, или головная боль».
  • Ступенька 30 — «О линиях. Просто и полезно».
  • Ступенька 31 — «Как убрать отступы (поля) документа, topmargin, leftmargin, marginwidth, marginheight».
  • Ступенька 32 — «О списках. Неупорядоченные списки».
  • Ступенька 33 — «Упорядоченные списки. Ремарка: что такое спецификация и консорциум».
  • Ступенька 34 — «Cпецифические тэги, бегущая строка текста».

    Фреймы.

  • Ступенька 35 — «Вступление. Зачем они (фреймы) нужны.»
  • Ступенька 36 — «Учимся создавать фреймы».
  • Ступенька 37 — «Учимся создавать фреймы» продолжение.
  • Ступенька 38 — «Учимся создавать фреймы» продолжение.
  • Ступенька 39 — «Убираем полосу прокрутки, избавляемся от рамок, регулируем ширину полей фрейма».
  • Ступенька 40 — «При нажатии на ссылку документ открывается в другом фрейме, в полное окно».
  • Ступенька 41 — «Последняя глава о фреймах. Что такое IFrame».
  • Первые шаги в HTML, только самое необходимое

    HTML  /  5 комментариев

    Верите ли вы, что можно изучить HTML, прочитав только одну статью на блоге? Сейчас это выясним.

    Я думаю никто не будет спорить, что если купить какой-нибудь учебник по HTML, то информация в нем будет плохо структурирована; кучу всяких тегов пытаются забить тебе в голову уже на первых страницах, о существовании которых некоторые веб-разработчики даже не подозревают.

    Довольно болтовни. Скажу лишь, что HTML, который вы здесь увидите, можно спокойно называть XHTML, потому что он в принципе удовлетворяет всем требованиям.

    HTML теги (синтаксис)

    Они бывают двух видов:

    <название_тега></название_тега>
    <название_тега />

    Как определить, когда тег должен быть первого вида а когда второго? Да никак — просто запомнить. К счастью запоминать много не придётся.

    Атрибуты тегов

    <название_тега название_атрибута="значение"></название_тега>
    <название_тега название_атрибута="значение" />

    Одним словом это параметры, типа х=»2″ или адрес_ссылки=»http://google.com».

    Структура страницы

    <!DOCTYPE html> 
    <html><head>
     
    </head>
    <body>
     
    </body></html>

    Между тегами <head> и </head> находится необходимая информация о странице, а также подключаются CSS-стили и в некоторых случаях скрипты.

    Между <body> и </body> уже само содержание страницы.

    Содержимое тега

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <title>Портфолио, разработка сайтов, truemisha.ru</title>
    <meta name="description" content="Разработка, а также доработка сайтов и оформление групп в социальных сетях" />
    <link rel="stylesheet" href="https://misha.agency/style.css" type="text/css" media="screen" />

    Как ни странно, иногда этих четырёх строчек бывает достаточно. Сейчас расскажу, что они означают.

    Кстати, на нубо-сайтах я встречал целые помойки в <head>, бывало даже так, что некоторые строчки повторялись по три раза 🙂

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    Это кодировка страницы. Чаще всего используется именно UTF-8, даже на зарубежных сайтах. Поэтому рекомендую не париться и тупо копировать её отсюда.

    <title>Портфолио, разработка сайтов, truemisha. ru</title>

    Это заголовок страницы, например его можно увидеть, если навести мышкой на вкладку в браузере. Очень важная вещь, особенно для поисковиков.

    <meta name="description" content="Разработка, а также доработка сайтов и оформление групп в социальных сетях" />

    Описание страницы, должно отличается от заголовка. Для посетителей не имеет никакого значения, но важно для поисковиков, в частности для Google, он чаще всего составляет сниппет из этого описания, а это уже видят потенциальные посетители.

    Сниппет обведен красным цветом. Понятно, что чем интереснее он будет выглядеть, тем больше вероятность того, что пользователи перейдут на сайт.

    <link rel="stylesheet" href="https://misha.agency/style.css" type="text/css" media="screen" />

    Подключение стилей. Там где href=»» указываем путь к таблице стилей (я про файл .css)

    Содержимое тега <body>

    Здесь может быть куча всего, но я не буду бросаться вперёд и расскажу только о тех вещах, в которых можно полностью разобраться уже сейчас.

    Ссылка:

    <a href="адрес_ссылки">текст_ссылки</a>

    Картинка:
    Обратите внимание, что ширина и высота указываются здесь просто цифрами без «px».
    Описание и размеры картинки важны только для поисковиков.

    <img src="адрес_картинки" alt="описание" />

    Форматирование текста:
    Google любит красиво отформатированные тексты.

    <strong>жирный текст</strong>
    <em>курсив</em>
    перенос<br />строки
    <h2>Заголовок 1-го уровня, должен быть один на странице</h2>
    <h3>Заголовок 2-го уровня</h3>
    <h4>Заголовок 3-го уровня</h4>
    <h5>Заголовок 4-го уровня</h5>
    <h5>Заголовок 5-го уровня</h5>
    <h6>Заголовок 6-го уровня, зачем их столько нужно:) </h6>

    В HTML ещё много всяких фишек по форматированию, но вместо них лучше использовать CSS.

    Списки:
    При помощи стилей с ними можно вытворять что угодно. Иногда очень удобно использовать именно их.

    Маркированный список:

    <ul>
    <li>Первый элемент списка</li>
    <li>Второй элемент списка</li>
    <li>Третий и так до бесконечности</li>
    </ul>

    Нумированный список:

    <ol>
    <li>Первый элемент списка</li>
    <li>Второй элемент списка и так далее</li>
    </ol>

    Блочные элементы:

    <div>Обычный блок</div>
    <p>Абзац</p>
    <span>Кусок текста</span>

    Функциональность блоков будет более подробно рассмотрена в статье про вёрстку.

    А теперь нажмите Ctrl + U и взгляните на HTML-код этой страницы. Практически ничего нового, удачи 🙂

    Миша

    Впервые познакомился с WordPress в 2009 году. Организатор и спикер на конференциях WordCamp. Преподаватель в школе Нетология.

    Пишите, если нужна помощь с сайтом или разработка с нуля.

    Первые шаги по документированию вашего проекта с помощью Sphinx — документация Sphinx

    Создание HTML-документации

    Файл index. rst , созданный sphinx-quickstart , имеет некоторый контент уже, и он отображается как первая страница вашей HTML-документации. Это написан на reStructuredText, мощном языке разметки.

    Измените файл следующим образом:

    docs/source/index.rst

     Добро пожаловать в документацию Lumache!
    ====================================
    **Lumache** (/lu'make/) — это библиотека Python для поваров и гурманов,
    создает рецепты, смешивая случайные ингредиенты. Он извлекает данные из Open Food
    База данных фактов 
    `_ и предлагает *простой* и *интуитивный* API. .. примечание:: Этот проект находится в активной разработке.

    Это демонстрирует несколько особенностей синтаксиса reStructuredText, в том числе:

    • a заголовок раздела с использованием === для подчеркивания,

    • два примера встроенной разметки: **сильный акцент** (обычно полужирный) и *выделение* (обычно курсив),

    • встроенная внешняя ссылка ,

    • и примечание предупреждение (одна из доступных директив)

    Теперь, чтобы отобразить его с новым содержимым, вы можете использовать команду sphinx-build . как и раньше, или воспользуйтесь удобным скриптом следующим образом:

     (.venv) $ cd документы
    (.venv) $ сделать html
     

    После выполнения этой команды вы увидите, что index.html отражает новый изменения!

    Создание документации в других форматах

    Sphinx поддерживает множество форматов помимо HTML, включая PDF, EPUB, и более. Например, для создания документации в формате EPUB запустите эту команду с документы каталог:

     (.venv) $ сделать epub
     

    После этого вы увидите файлы, соответствующие электронной книге под документы/сборка/epub/ . Вы можете либо открыть Lumache.epub с помощью EPUB-совместимая программа для просмотра электронных книг, например Calibre, или просмотрите index.xhtml в веб-браузере.

    Примечание

    Для быстрого отображения полного списка возможных выходных форматов, а также некоторых дополнительные полезные команды, вы можете запустить make help .

    Каждый выходной формат имеет определенные параметры конфигурации, которые можно настроить. включая EPUB. Например, значение по умолчанию для epub_show_urls — это встроенный , что означает, что по умолчанию URL-адреса отображается сразу после соответствующей ссылки в круглых скобках. Вы можете изменить это поведение, добавив следующий код в конец вашего conf.py :

     # Варианты EPUB
    epub_show_urls = 'сноска'
     

    С этим значением конфигурации и после запуска снова сделайте epub , вы обратите внимание, что URL-адреса теперь отображаются в виде сносок, что позволяет избежать загромождения текста. Сладкий! Читайте дальше, чтобы узнать о других способах настройки Сфинкс.

    Note

    Создание PDF-файла с помощью Sphinx можно выполнить, запустив make latexpdf , при условии, что в системе установлена ​​рабочая установка LaTeX, как описано в документации sphinx.builders.latex.LaTeXBuilder . Хотя это вполне осуществимо, такие установки часто бывают большими, и вообще LaTeX в некоторых случаях требует тщательной настройки, поэтому генерация PDF выходит за рамки этого руководства.

    2 Первые шаги | ggplot2

    2.1 Введение

    Цель этой главы — научить вас создавать полезную графику с помощью ggplot2 как можно быстрее. Вы изучите основы ggplot() вместе с некоторыми полезными «рецептами» для создания наиболее важных графиков. ggplot() позволяет создавать сложные графики с помощью всего нескольких строк кода, поскольку он основан на богатой базовой теории — грамматике графики. Здесь мы пропустим теорию и сосредоточимся на практике, а в следующих главах вы узнаете, как использовать всю выразительную мощь грамматики.

    В этой главе вы узнаете:

    • О наборе данных миль на галлон , включенном в ggplot2, раздел 2.2.

    • Три ключевых компонента каждого сюжета: данные, эстетика и геометрия, Раздел 2. 3.

    • Как добавить на график дополнительные переменные с эстетикой, Раздел 2.4.

    • Как отобразить дополнительные категориальные переменные на графике с помощью малые кратные, созданные огранкой, раздел 2.5.

    • Различные геометрические фигуры, которые можно использовать для создания различных типы участков, раздел 2.6.

    • Как изменить оси, раздел 2.7.

    • Что можно делать с объектом графика, кроме его отображения, например сохранить на диск, раздел 2.8.

    2.2 Данные об экономии топлива

    В этой главе мы в основном будем использовать один набор данных, связанный с ggplot2: миль на галлон . Он включает в себя информацию об экономии топлива популярных моделей автомобилей в 1999 и 2008 г., собранные Агентством по охране окружающей среды США, http://fueleconomy.gov. Вы можете получить доступ к данным, загрузив библиотеку ggplot2:

     (ggplot2)
    миль на галлон
    #> # Таблица: 234 × 11
    #> производитель модель год выпуска cyl trans drv cty hwy fl class
    #>           
    #> 1 audi a4 1. 8 1999 4 авто(l5) f 18 29п компа…
    #> 2 audi a4 1.8 1999 4 МКПП(m5) f 21 29 p compa…
    #> 3 audi a4 2 2008 4 инструкция(m6) f 20 31 p compa…
    #> 4 audi a4 2 2008 4 auto(av) f 21 30 p compa…
    #> 5 audi a4 2.8 1999 6 auto(l5) f 16 26 p compa…
    #> 6 audi a4 2.8 1999 6 механика(m5) f 18 26 p compa…
    #> # … еще 228 строк 

    Переменные в основном не требуют пояснений:

    • cty и hwy рекордные мили на галлон (миль на галлон) для езды по городу и шоссе.

    • displ — рабочий объем двигателя в литрах.

    • drv — трансмиссия: переднее колесо (f), заднее колесо (r) или четыре колеса (4).

    • модель модель автомобиля. Есть 38 моделей, выбранных потому, что они новое издание каждый год с 1999 по 2008 год.

    • класс — категориальная переменная, описывающая «тип» автомобиль: двухместный, внедорожник, компакт и т. д.

    Этот набор данных предлагает много интересных вопросов. Как связаны объем двигателя и расход топлива? Заботятся ли одни производители об экономии топлива больше, чем другие? Улучшилась ли экономия топлива за последние десять лет? Мы попытаемся ответить на некоторые из этих вопросов, а в процессе научимся создавать базовые графики с помощью ggplot2.

    2.2.1 Упражнения

    1. Перечислите пять функций, которые можно использовать для получения дополнительной информации о миль на галлон набор данных.

    2. Как узнать, какие еще наборы данных включены в ggplot2?

    3. За исключением США, в большинстве стран используется расход топлива (расход топлива на фиксированное расстояние), а не экономия топлива (расстояние, пройденное с фиксированное количество топлива). Как можно преобразовать cty и hwy в Европейский стандарт л/100км?

    4. У какого производителя больше всего моделей в этом наборе данных? Какая модель имеет самые вариации? Изменится ли ваш ответ, если вы уберете лишнее? спецификация трансмиссии (например, «pathfinder 4wd», «a4 quattro») из название модели?

    2.

    3 Основные компоненты

    Каждый график ggplot2 состоит из трех ключевых компонентов:

    1. данные ,

    2. Набор из эстетических отображений между переменными в данных и визуальные свойства и

    3. Как минимум один слой, описывающий, как визуализировать каждое наблюдение. Слои обычно создаются с помощью функции geom .

    Вот простой пример:

     ggplot(mpg, aes(x = displ, y = hwy)) +
      geom_point() 

    Это создает диаграмму рассеяния, определяемую:

    1. Данные: миль на галлон .
    2. Эстетическое сопоставление: объем двигателя сопоставляется с положением x, экономия топлива — с положением y позиция.
    3. Слой: точки.

    Обратите внимание на структуру вызова этой функции: данные и эстетические отображения предоставляются в ggplot() , затем добавляются слои с помощью + . Это важный шаблон, и по мере того, как вы узнаете больше о ggplot2, вы будете создавать все более сложные графики, добавляя все больше типов компонентов.

    Почти каждый график отображает переменную в x и y , поэтому называть эти эстетические элементы утомительно, поэтому первые два безымянных аргумента aes() будет сопоставлено с x и y . Это означает, что следующий код идентичен приведенному выше примеру:

     ggplot(mpg, aes(displ, hwy)) +
      geom_point() 

    Мы будем придерживаться этого стиля на протяжении всей книги, поэтому не забывайте, что первые два аргумента aes() равны x и y . Обратите внимание, что мы помещаем каждую команду в новую строку. Мы рекомендуем делать это в вашем собственном коде, чтобы было легко просмотреть спецификацию графика и точно увидеть, что там есть. В этой главе мы иногда будем использовать только одну линию на графике, потому что так будет легче увидеть различия между вариантами графика.

    График показывает сильную корреляцию: чем больше объем двигателя, тем хуже экономия топлива. Есть также несколько интересных исключений: некоторые автомобили с большими двигателями имеют более высокую топливную экономичность, чем в среднем. Как вы думаете, что это за машины?

    2.3.1 Упражнения

    1. Как бы вы описали взаимосвязь между cty и hwy ? Есть ли у вас опасения делать выводы из этого сюжета?

    2. Что показывает ggplot(миль на галлон, aes(модель, производитель)) + geom_point() ? Это полезно? Как можно изменить данные, чтобы сделать их более информативными?

    3. Опишите данные, эстетические отображения и слои, используемые для каждого из следующие сюжеты. Вам нужно немного угадать, потому что вы не видели все наборы данных и функции, но используйте свой здравый смысл! Посмотрите, если вы может предсказать, как будет выглядеть сюжет, до запуска кода.

      1. ggplot(mpg, aes(cty, hwy)) + geom_point()
      2. ggplot(бриллианты, AES(карат, цена)) + geom_point()
      3. ggplot(экономика, aes(дата, безработица)) + geom_line()
      4. ggplot(миль на галлон, аэ(ст)) + geom_histogram()

    2.

    4 Цвет, размер, форма и другие эстетические характеристики

    Чтобы добавить дополнительные переменные к графику, мы можем использовать другие эстетические элементы, такие как цвет, форма и размер (примечание: хотя в этой книге мы используем британское правописание, ggplot2 также принимает американское правописание). Они работают так же, как x и y эстетики и добавляются в вызов aes() :

    • aes(displ, hwy, color = class)
    • aes(displ, hwy, shape = drv)
    • aes(displ, hwy, size = cyl)

    ggplot2 заботится о деталях преобразования данных (например, «f», «r», «4») в эстетику (например, «красный», «желтый», «зеленый») со шкалой . Существует одна шкала для каждого эстетического отображения на графике. Масштаб также отвечает за создание направляющей, оси или легенды, которые позволяют читать график, преобразовывая эстетические значения обратно в значения данных. На данный момент мы будем придерживаться шкал по умолчанию, предоставленных ggplot2. Вы узнаете, как переопределить их, в главе 11.

    Чтобы узнать больше об этих внешних переменных на предыдущей диаграмме рассеяния, мы могли бы сопоставить переменную класса с цветом:

     ggplot(mpg, aes(displ, hwy, color = class)) +
      geom_point() 

    Это дает каждой точке уникальный цвет, соответствующий ее классу. Легенда позволяет нам считывать значения данных по цвету, показывая нам, что группа автомобилей с необычно высокой экономией топлива для их размера двигателя состоит из двухместных автомобилей: автомобили с большими двигателями, но легкими кузовами.

    Если вы хотите установить для эстетики фиксированное значение без масштабирования, сделайте это в отдельном слое за пределами aes() . Сравните следующие два графика:

     ggplot(mpg, aes(displ, hwy)) + geom_point(aes(color = "blue"))
    ggplot(mpg, aes(displ, hwy)) + geom_point(color = "blue") 

    На первом графике значение «синий» масштабируется до розоватого цвета, и добавляется легенда. На втором графике точкам присвоен синий цвет R. Это важная техника, и вы узнаете о ней больше в Разделе 14.4.2. См. vignette("ggplot2-specs") для значений, необходимых для цвета и другой эстетики.

    Различные типы эстетических атрибутов лучше работают с различными типами переменных. Например, цвет и форма хорошо работают с категориальными переменными, а размер хорошо работает с непрерывными переменными. Количество данных также имеет значение: если данных много, может быть трудно различить разные группы. Альтернативным решением является использование огранки, как описано далее.

    При использовании эстетики в сюжете, чем меньше, тем лучше. Трудно увидеть одновременные отношения между цветом, формой и размером, поэтому проявляйте сдержанность при использовании эстетики. Вместо того, чтобы пытаться сделать один очень сложный сюжет, показывающий все сразу, попробуйте создать серию простых сюжетов, рассказывающих историю, ведущую читателя от невежества к знанию.

    2.

    4.1 Упражнения
    1. Экспериментируйте с эстетикой цвета, формы и размера. Что происходит, когда вы сопоставляете их с непрерывными значениями? А как насчет категориальных значений? Что происходит, когда вы используете более одной эстетики в сюжете?

    2. Что произойдет, если преобразовать непрерывную переменную в форму? Почему? Что происходит если сопоставить транс с формой? Почему?

    3. Как трансмиссия связана с экономией топлива? Как трансмиссия связана с объем двигателя и класс?

    2.5 Огранка

    Другой метод отображения дополнительных категориальных переменных на графике — это огранка. Faceting создает таблицы графики, разбивая данные на подмножества и отображая один и тот же график для каждого подмножества. Вы узнаете больше об огранке в разделе 17, но это настолько полезная техника, что вам нужно знать ее прямо сейчас.

    Огранка бывает двух видов: сетка и обертка. Wrapped наиболее полезен, поэтому мы обсудим его здесь, а о гранях сетки вы сможете узнать позже. Чтобы огранить график, вы просто добавляете спецификацию огранки с facet_wrap() , который берет имя переменной, которому предшествуют ~ .

     ggplot(mpg, aes(displ, hwy)) +
      геометрическая_точка() +
      facet_wrap(~class) 

    Вы можете задаться вопросом, когда использовать фасетирование и когда использовать эстетику. Вы узнаете больше об относительных преимуществах и недостатках каждого из них в Разделе 17.5.

    2.5.1 Упражнения

    1. Что произойдет, если вы попытаетесь фасетировать непрерывную переменную, например шоссе ? Как насчет цил ? В чем ключевая разница?

    2. Используйте фасетирование, чтобы исследовать трехстороннюю взаимосвязь между экономией топлива, объем двигателя и количество цилиндров. Как происходит огранка по количеству цилиндры меняют вашу оценку отношений между объем двигателя и расход топлива?

    3. Прочтите документацию для facet_wrap() . Какие аргументы вы можете использовать контролировать количество строк и столбцов в выводе?

    4. Что означает масштабирует аргумент до facet_wrap() делать? Когда вы можете использовать это?

    2.6 Геометрия участка

    Вы можете догадаться, что, заменив geom_point() на другой функцией geom, вы получите график другого типа. Это отличное предположение! В следующих разделах вы узнаете о некоторых других важных геометриях, представленных в ggplot2. Это не исчерпывающий список, но он должен охватывать наиболее часто используемые типы сюжетов. Вы узнаете больше в главах 3 и 4.

    • geom_smooth() подгоняет сглаживание к данным и отображает сглаживание и его стандартная ошибка.

    • geom_boxplot() создает график типа «ящик с усами» для суммирования распределения из набора точек.

    • geom_histogram() и geom_freqpoly() показывают распределение непрерывные переменные.

    • geom_bar() показывает распределение категориальных переменных.

    • geom_path() и geom_line() рисовать линии между точками данных. Линейный график ограничен созданием линий, которые проходят слева направо, в то время как пути могут идти в любом направлении. Линии обычно используются для изучения как все меняется со временем.

    2.6.1 Добавление сглаживания к графику

    Если у вас есть диаграмма рассеяния с большим количеством шума, может быть трудно увидеть доминирующий шаблон. В этом случае полезно добавить на график сглаженную линию с geom_smooth() :

     ggplot(миль на галлон, aes(displ, hwy)) +
      геометрическая_точка() +
      geom_smooth()
    #> `geom_smooth()` с использованием method = 'loess' и формулы 'y ~ x' 

    Это накладывает на диаграмму рассеяния гладкую кривую, включая оценку неопределенности в виде точечных доверительных интервалов, показанных серым цветом. Если вас не интересует доверительный интервал, отключите его с помощью geom_smooth(se = FALSE) .

    Важный аргумент для geom_smooth() — это метод , который позволяет выбрать, какой тип модели используется для соответствия плавной кривой:

    • method = "loess" , по умолчанию для малых n, использует гладкую локальную регрессия (как описано в ?loess ). Волнистость линии управляется параметром span , который находится в диапазоне от 0 (чрезвычайно волнистый) до 1 (не так волнообразно).

       ggplot(mpg, aes(displ, hwy)) +
        геометрическая_точка() +
        geom_smooth (диапазон = 0,2)
      #> `geom_smooth()` с использованием метода = 'loess' и формулы 'y ~ x'
      ggplot (миль на галлон, aes (displ, hwy)) +
        геометрическая_точка() +
        geom_smooth (диапазон = 1)
      #> `geom_smooth()` с использованием метода = 'loess' и формулы 'y ~ x' 92)\) в памяти), поэтому
      альтернативный алгоритм сглаживания используется, когда \(n\) больше 1000.  

    • method = "gam" соответствует обобщенной аддитивной модели, предоставленной mgcv упаковка. Вам нужно сначала загрузить mgcv, а затем использовать формулу вроде формула = y ~ s(x) или y ~ s(x, bs = "cs") (для больших данных). Это что использует ggplot2, когда точек больше 1000.

       библиотека (мгцв)
      ggplot (миль на галлон, aes (displ, hwy)) +
        геометрическая_точка() +
        geom_smooth (метод = "gam", формула = y ~ s(x)) 
    • method = "lm" соответствует линейной модели, давая линию наилучшего соответствия.

       ggplot(mpg, aes(displ, hwy)) +
        геометрическая_точка() +
        geom_smooth (метод = "лм")
      #> `geom_smooth()` по формуле 'y ~ x' 
    • method = "rlm" работает как lm() , но использует надежный алгоритм подгонки, поэтому что выбросы не так сильно влияют на подгонку. Это часть MASS . package, поэтому не забудьте сначала загрузить его.

    2.6.2 Коробчатые диаграммы и флуктуирующие точки 90–107

    Когда набор данных включает категориальную переменную и одну или несколько непрерывных переменных, вам, вероятно, будет интересно узнать, как значения непрерывных переменных меняются в зависимости от уровней категориальной переменной. Скажем, нам интересно посмотреть, как расход топлива варьируется в автомобилях с одинаковым типом трансмиссии. Мы могли бы начать с такой диаграммы рассеяния:

     ggplot(mpg, aes(drv, hwy)) +
      геом_точка() 

    Поскольку существует мало уникальных значений как drv , так и hwy , на графике много перерисовки. Многие точки нанесены в одном и том же месте, и трудно увидеть распределение. Есть три полезных метода, которые помогают решить эту проблему:

    • Дрожание, geom_jitter() , добавляет к данным небольшой случайный шум, который может помогите не переборщить.

    • Boxplots, geom_boxplot() , обобщить форму распределения с небольшой сводной статистикой.

    • Графики скрипки, geom_violin() , показывают компактное представление «плотность» распределения, выделение областей, где больше точек найдены.

    Они показаны ниже:

     ggplot(mpg, aes(drv, hwy)) + geom_jitter()
    ggplot (миль на галлон, aes (drv, hwy)) + geom_boxplot ()
    ggplot(mpg, aes(drv, hwy)) + geom_violin() 

    Каждый метод имеет свои сильные и слабые стороны. Блочные диаграммы суммируют основную часть распределения всего с пятью числами, в то время как графики с флуктуациями показывают каждую точку, но работают только с относительно небольшими наборами данных. Скрипичные графики дают наиболее полное отображение, но основаны на расчете оценки плотности, которую трудно интерпретировать.

    Для точек с дрожанием geom_jitter() предлагает тот же контроль над эстетикой, что и geom_point() : размер , цвет и форма . Для geom_boxplot() и geom_violin() вы можете управлять цветом контура или цветом внутренней заливки .

    2.6.3 Гистограммы и полигоны частот 90–107

    Гистограммы и многоугольники частот показывают распределение одной числовой переменной. Они предоставляют больше информации о распределении отдельной группы, чем коробочные диаграммы, за счет того, что им требуется больше места.

     ggplot(миль на галлон, aes(hwy)) + geom_histogram()
    #> `stat_bin()`, используя `bins = 30`. Выберите лучшее значение с помощью `binwidth`.
    ggplot (миль на галлон, aes (hwy)) + geom_freqpoly ()
    #> `stat_bin()`, используя `bins = 30`. Выберите лучшее значение с помощью `binwidth`. 

    И гистограммы, и частотные полигоны работают одинаково: они группируют данные, а затем подсчитывают количество наблюдений в каждом бине. Единственная разница заключается в отображении: в гистограммах используются полосы, а в полигонах частот — линии.

    Вы можете контролировать ширину контейнеров с помощью 9Аргумент 0005 binwidth (если вам не нужны равномерно распределенные бины, вы можете использовать аргумент breaks ). Очень важно поэкспериментировать с шириной корзины. По умолчанию ваши данные просто разбиваются на 30 ячеек, что вряд ли будет лучшим выбором. Вы всегда должны пробовать разные ширины бинов, и вы можете обнаружить, что вам нужно несколько значений ширины бинов, чтобы рассказать полную историю ваших данных.

     ggplot(миль на галлон, км/ч(шоссе)) +
      geom_freqpoly (ширина бина = 2,5)
    ggplot (миль на галлон, aes (hwy)) +
      geom_freqpoly (ширина бина = 1) 

    Альтернативой полигону частот является график плотности, geom_density() . При использовании графиков плотности требуется небольшая осторожность: по сравнению с полигонами частот их труднее интерпретировать, поскольку лежащие в их основе вычисления более сложны. Они также делают предположения, которые не верны для всех данных, а именно, что основное распределение является непрерывным, неограниченным и гладким.

    Чтобы сравнить распределения различных подгрупп, вы можете сопоставить категориальную переменную с любой заливкой (для geom_histogram() ) или цвет (для geom_freqpoly() ). Сравнивать распределения с помощью полигона частот проще, потому что основная задача восприятия проще. Вы также можете использовать фасетирование: это немного усложняет сравнение, но легче увидеть распределение каждой группы.

     ggplot(mpg, aes(displ, color = drv)) +
      geom_freqpoly (ширина интервала = 0,5)
    ggplot (миль на галлон, aes (displ, fill = drv)) +
      geom_histogram (ширина интервала = 0,5) +
      facet_wrap(~drv, ncol = 1) 

    2.6.4 Гистограммы

    Дискретным аналогом гистограммы является гистограмма, geom_bar() . Его легко использовать:

     ggplot(миль на галлон, aes(производитель)) +
      geom_bar() 

    (Вы узнаете, как исправить метки в Разделе 18.4.2).

    Гистограммы могут сбивать с толку, потому что есть два довольно разных графика, которые обычно называют гистограммами. Приведенная выше форма предполагает, что у вас есть несуммированные данные, и каждое наблюдение добавляет одну единицу к высоте каждого столбца. Другая форма гистограммы используется для предварительно суммированных данных. Например, у вас может быть три препарата со средним эффектом:

     наркотики <- data.frame(
      препарат = с ("а", "б", "с"),
      эффект = c(4.2, 9.7, 6.1)
    ) 

    Чтобы отобразить данные такого типа, вам нужно сообщить geom_bar() , чтобы он не запускал статистику по умолчанию, которая группирует и подсчитывает данные. Однако мы считаем, что даже лучше использовать geom_point() , потому что точки занимают меньше места, чем столбцы, и не требуют, чтобы ось Y включала 0.

     ggplot(drugs, aes(drug, effect)) + geom_bar (статистика = "личность")
    ggplot(наркотики, aes(наркотик, эффект)) + geom_point() 

    2.6.5 Временные ряды с линейными и путевыми графиками 90–107

    Линейные и траекторные графики обычно используются для данных временных рядов. Линейные графики соединяют точки слева направо, а линейные графики соединяют их в том порядке, в котором они появляются в наборе данных (другими словами, линейный график — это линейный график данных, отсортированных по значению x). Линейные графики обычно имеют время по оси x, показывая, как одна переменная изменилась с течением времени. Графики траекторий показывают, как две переменные одновременно изменяются с течением времени, при этом время закодировано в том, как связаны наблюдения.

    Поскольку переменная года в наборе данных миль на галлон имеет только два значения, мы покажем несколько графиков временных рядов, используя набор данных economics , который содержит экономические данные по США, измеренные за последние 40 лет. На рисунке ниже показаны два графика безработицы с течением времени, оба получены с использованием geom_line() . Первый показывает уровень безработицы, а второй показывает среднее количество недель без работы. Мы уже можем видеть некоторые различия в этих двух переменных, особенно в последнем пике, где процент безработицы ниже, чем в предыдущие пики, но продолжительность безработицы высока.

     ggplot(экономика, aes(дата, безработица/поп)) +
      геометрическая_линия()
    ggplot(экономика, aes(дата, uempmed)) +
      geom_line() 

    Чтобы изучить эту связь более подробно, мы хотели бы изобразить оба временных ряда на одном графике. Мы могли бы нарисовать график рассеяния уровня безработицы в зависимости от продолжительности безработицы, но тогда мы больше не могли видеть эволюцию во времени. Решение состоит в том, чтобы соединить точки, смежные во времени, с отрезками линий, образуя график путей .

    Ниже мы наносим уровень безработицы в зависимости от продолжительности безработицы и соединяем отдельные наблюдения путем. Из-за множества пересечений линий направление, в котором течет время, на первом графике увидеть непросто. На втором графике мы раскрашиваем точки, чтобы было легче увидеть направление времени.

     ggplot(экономика, aes(безработица/поп, uempmed)) +
      геом_путь() +
      геометрическая_точка()
    year <- function(x) as.POSIXlt(x)$year + 1900
    ggplot(экономика, aes(безработица/население, uempmed)) +
      geom_path (цвет = "grey50") +
      geom_point(aes(цвет = год(дата))) 

    Мы видим, что уровень безработицы и продолжительность безработицы тесно связаны, но в последние годы продолжительность безработицы увеличивается относительно уровня безработицы.

    С продольными данными часто требуется отобразить несколько временных рядов на каждом графике, каждый ряд представляет одного человека. Для этого вам нужно сопоставить эстетику группы с переменной, кодирующей членство в группе каждого наблюдения. Более подробно это объясняется в главе 4.

    2.6.6 Упражнения

    1. В чем проблема с сюжетом, созданным ggplot(mpg, aes(cty, hwy)) + geom_point() ? Какой из геом. описанное выше является наиболее эффективным для устранения проблемы?

    2. Одна задача с ggplot(миль на галлон, aes(класс, шоссе)) + geom_boxplot() заключается в том, что класс расположен в алфавитном порядке, что не очень полезный. Как бы вы могли изменить уровни факторов, чтобы сделать их более информативными?

      Вместо того, чтобы переупорядочивать фактор вручную, вы можете сделать это автоматически на основании данных: ggplot(миль на галлон, aes(переупорядочить(класс, шоссе), шоссе)) + geom_boxplot() . Что делает reorder() ? Прочтите документацию.

    3. Исследование распределения переменной карата в бриллиантах набор данных. Какая ширина бина выявляет самые интересные закономерности?

    4. Исследуйте распределение ценовой переменной для бриллиантов данные. Как распределение зависит от разреза?

    5. Теперь вы знаете (как минимум) три способа сравнения распределений подгруппы: geom_violin() , geom_freqpoly() и цветовая эстетика, или geom_histogram() и огранка. Каковы сильные и слабые стороны каждого подхода? Какие еще подходы вы могли бы попробовать?

    6. Прочтите документацию для geom_bar() . Что значит весит эстетично делать?

    7. Используя методы, уже рассмотренные в этой главе, придумайте три способа визуализации двухмерного категориального распределения. Попробуйте их путем визуализации распределения модели и производителя , транс и класс и цил и транс .

    2.7 Модификация осей

    Вы изучите полный набор опций, доступных в следующих главах, но два семейства полезных помощников позволят вам вносить наиболее распространенные модификации. xlab() и ylab() изменить метки осей x и y:

     ggplot(mpg, aes(cty, hwy)) +
      geom_point (альфа = 1/3)
    ggplot (миль на галлон, aes (город, шоссе)) +
      geom_point (альфа = 1/3) +
      xlab("вождение по городу (миль на галлон)") +
      ylab("вождение по шоссе (миль на галлон)")
    # Удалить метки осей с помощью NULL
    ggplot (миль на галлон, aes (город, шоссе)) +
      geom_point (альфа = 1/3) +
      кслаб (НУЛЬ) +
      ylab(NULL) 

    xlim() и ylim() изменить пределы осей:

     ggplot(mpg, aes(drv, hwy)) +
      geom_jitter (ширина = 0,25)
    ggplot (миль на галлон, aes (drv, hwy)) +
      geom_jitter (ширина = 0,25) +
      xlim("f", "r") +
      илим (20, 30)
    #> Внимание: удалено 140 строк, содержащих пропущенные значения (geom_point). 
      
    # Для непрерывных шкал используйте NA, чтобы установить только один предел
    ggplot (миль на галлон, aes (drv, hwy)) +
      geom_jitter (ширина = 0,25, na.rm = TRUE) +
      ylim(NA, 30) 

    Изменение пределов осей устанавливает значения вне диапазона до NA . Вы можете подавить соответствующее предупреждение с помощью na.rm = TRUE , но будьте осторожны. Если ваш график вычисляет сводную статистику (например, выборочное среднее), это преобразование в NA происходит до того, как будет вычислена сводная статистика, и в некоторых ситуациях может привести к нежелательным результатам.

    2.8 Выход

    В большинстве случаев вы создаете объект графика и сразу же его рисуете, но вы также можете сохранить график в переменную и манипулировать им:

     p <- ggplot(mpg, aes(displ, hwy, color = factor(cyl ))) +
      геом_точка() 

    Если у вас есть сюжетный объект, вы можете сделать с ним несколько вещей:

    • Визуализируйте его на экране с помощью print() . Это происходит автоматически, когда в интерактивном режиме, но внутри цикла или функции вам нужно будет print() сам.

       печать(п) 
    • Сохраните его на диск с помощью ggsave() , описанного в Разделе 18.5.

       # Сохранить png на диск
      ggsave("plot.png", p, ширина = 5, высота = 5) 
    • Кратко опишите его структуру с помощью summary() .

       резюме(p)
      #> данные: производитель, модель, объем, год, цилиндр, транс, привод, город, шоссе, фл,
      #> класс [234x11]
      #> отображение: x = ~displ, y = ~hwy, color = ~factor(cyl)
      #> faceting:  #> calculate_layout: функция
      #> draw_back: функция
      #> draw_front: функция
      #> draw_labels: функция
      #> draw_panels: функция
      #> Finish_data: функция
      #> init_scales: функция
      #> map_data: функция
      #> параметры: список
      #> setup_data: функция
      #> setup_params: функция
      #> уменьшить: ИСТИНА
      #> train_scales: функция
      #> переменные: функция
      #> super:  #> --------------------------------------------------
      #> geom_point: na.
    Оставить комментарий

    Добавить комментарий

    Ваш адрес email не будет опубликован. Обязательные поля помечены *