udemy
Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.
Визуализации данных с D3.js [2020 UPDATE]
Mastering data visualization in D3.js [2020 UPDATE]
★4.6 (всего оценок - 25)
Продолжительность
6 ч 24 мин
Категория
D3.jsКоличество уроков
84 Видео
Дата добавления
21 июн. 2018 г., 15:52
Язык
Английский
Дата выхода
9 июн. 2018 г., 18:43
Дата обновления
29 апр. 2026 г., 00:39
Курс «Визуализации данных с D3.js» — это практичное и обновлённое введение в одну из самых мощных библиотек для работы с данными. Материал ориентирован на тех, кто хочет уверенно создавать интерактивные графики, настраивать поведение визуализаций и понимать, как работает современный стек D3 5.x.
Что вы изучите в начале курса
Стартовая часть курса помогает создать прочный фундамент для дальнейшей работы с D3.js и визуализацией данных в целом.
Базовые концепции визуализаций
- Понимание природы SVG и их взаимодействия с элементами D3.
- Привязка данных к графическим элементам и создание первых визуальных структур.
- Работа с осями, шкалами, подписями и другими элементами оформления диаграмм.
- Освоение паттерна обновления данных и построение динамичных визуализаций.
- Добавление интерактивности: события, реакции на действия пользователя, плавные обновления.
- Создание легенд, тултипов, контролов и других вспомогательных компонентов.
Принципы грамотного дизайна визуализаций
Вы узнаете, как выбирать корректные визуальные каналы, обосновывать решения по структуре визуализаций и создавать графики, которые эффективно передают данные.
Интенсив по 12 видам визуализаций
Вторая часть курса — это глубокое изучение готовых решений сообщества D3 и разбор множества практических примеров.
Визуализации, которые вы научитесь строить
- Line Charts
- Area Charts
- Stacked Area Charts
- Pie Charts
- Donut Charts
- Wordclouds
- Choropleth Maps
- Node-Link Diagrams
- Tree Diagrams
- Treemaps
- Circle Packs
- Sunburst Plots
Работа с чужим кодом и адаптация визуализаций
Вы научитесь разбирать чужие проекты, адаптировать open-source решения под свои данные и искать новые подходы к визуализации информации самостоятельно.
Финальная часть: продвинутые приёмы D3
На заключительном этапе курса вы оптимизируете структуру проектов и научитесь управлять несколькими визуализациями одновременно.
Связывание визуализаций и взаимодействие между графиками
Вы сможете создавать составные панели данных, где несколько графиков реагируют друг на друга и передают состояние через интерактивные элементы.
Работа с кистями (brushes)
Вы освоите выбор диапазонов и областей на диаграммах с помощью мыши и добавите возможность фильтрации данных пользователем.
Проектные задания
Курс включает четыре практических проекта, которые постепенно усложняются и дают реальный опыт применения D3.js.
Практические работы
- Создание простой гистограммы, отображающей рост доходов небольшой сети кофеен.
- Обновление bubble chart и воспроизведение визуализации в стиле проекта Gapminder.
- Интерактивная линейная диаграмма с динамикой цен криптовалют.
- Комплексная панель данных для крупного конгломерата.
Кому подходит этот курс
- Frontend‑разработчикам, желающим расширить навыки визуализации данных.
- Аналитикам, BI‑специалистам и дата‑саентистам.
- Тем, кто работает с dashboards и интерактивной аналитикой.
- Новичкам в D3.js, интересующимся современными методами работы с данными.
Почему этот курс стоит пройти
Обучение сочетает теорию, практику и разбор реальных примеров. Вы не только научитесь строить графики, но и поймёте, как делать визуализации осмысленными, интерактивными и удобными для пользователей.
- Урок 1.00:02:25Introduction to the course
- Урок 2.00:03:00What is a data visualization?
- Урок 3.00:04:31The power of D3
- Урок 4.00:03:04How this course is structured
- Урок 5.00:00:43Section Summary
- Урок 6.00:00:52Introduction - Getting started with D3
- Урок 7.00:05:19Setting up your environment
- Урок 8.00:06:21Understanding SVGs
- Урок 9.00:06:54Adding SVGs with D3
- Урок 10.00:04:52Selections and data joins
- Урок 11.00:07:44Loading external data
- Урок 12.00:00:45Section Summary
- Урок 13.00:01:07Introduction - Scales and Axes
- Урок 14.00:05:42Linear Scales
- Урок 15.00:03:18Logarithmic Scales
- Урок 16.00:01:30Time Scales
- Урок 17.00:02:43Ordinal Scales
- Урок 18.00:06:07Band Scales
- Урок 19.00:04:24D3 min, max, and extent
- Урок 20.00:06:38Margins and groups
- Урок 21.00:06:55Axes and labels
- Урок 22.00:04:47Making a bar chart
- Урок 23.00:02:22Project 1: StarBreak Coffee
- Урок 24.00:00:53Section Summary
- Урок 25.00:01:04Introduction - The basics of design
- Урок 26.00:03:21Designing for clarity
- Урок 27.00:03:19Subjectivity in design
- Урок 28.00:05:30The design toolkit
- Урок 29.00:05:45An introduction to sketching
- Урок 30.00:03:57The Bootstrap grid system
- Урок 31.00:00:44Section Summary
- Урок 32.00:01:30Introduction - Make it dynamic
- Урок 33.00:02:23Looping with intervals
- Урок 34.00:04:10Adding an update function
- Урок 35.00:05:54The D3 update pattern
- Урок 36.00:03:10Making our chart dynamic
- Урок 37.00:05:48D3 Transitions
- Урок 38.00:01:50Scatter plots in D3
- Урок 39.00:03:12Project 2: Gapminder Clone
- Урок 40.00:01:08Section Summary
- Урок 41.00:01:04Introduction - Make it interactive
- Урок 42.00:03:12Adding a legend
- Урок 43.00:06:53Formatting and parsing in D3
- Урок 44.00:08:16Introducing Tooltips
- Урок 45.00:10:17Event listeners and handlers in D3
- Урок 46.00:04:39Adding a jQuery UI slider
- Урок 47.00:08:08Line graphs in D3
- Урок 48.00:02:44Project 3: CoinStats
- Урок 49.00:01:13Section Summary
- Урок 50.00:01:31Introduction - Frequently used visualizations
- Урок 51.00:04:24Using the D3 community
- Урок 52.00:05:09Migrating code to version 5.x
- Урок 53.00:05:20D3 Layouts
- Урок 54.00:08:09Area Charts
- Урок 55.00:13:33Stacked Area Charts
- Урок 56.00:07:01Data structures and D3 nests
- Урок 57.00:17:02Pie and donut charts
- Урок 58.00:05:52Wordclouds
- Урок 59.00:00:55Section Summary
- Урок 60.00:01:13Introduction - Maps and Networks
- Урок 61.00:07:58Visualization around the globe
- Урок 62.00:05:05Loading multiple datasets with D3
- Урок 63.00:09:04Choropleth Maps
- Урок 64.00:08:26Forces in D3
- Урок 65.00:08:46Node-Link Diagrams
- Урок 66.00:01:09Section Summary
- Урок 67.00:01:35Introduction - Hierarchical Data
- Урок 68.00:05:04Building hierarchies in D3
- Урок 69.00:05:30Tree Diagrams
- Урок 70.00:07:55Treemaps
- Урок 71.00:06:00Circle Packing
- Урок 72.00:08:44Sunburst Plots
- Урок 73.00:01:22Section Summary
- Урок 74.00:01:11Introduction - File structure and linked views
- Урок 75.00:03:28File Separation
- Урок 76.00:07:28Visualizations as Objects
- Урок 77.00:07:54Converting our code to OOP
- Урок 78.00:06:50Handling events across objects
- Урок 79.00:08:36D3 Brushes
- Урок 80.00:04:14Project 4: A corporate data dashboard
- Урок 81.00:01:02Section Summary
- Урок 82.00:00:55Introduction - Wrapping up the course
- Урок 83.00:01:59What you learned
- Урок 84.00:01:31Concluding Thoughts
Автор - udemy
Комментарии
AnonymousThe course update to V6 in 2020, please update it, thanks.