Timeline Storyteller — это выразительная среда визуального повествования для представления временных шкал в браузере или в Microsoft Power BI.
Используйте его для представления различных аспектов данных временной шкалы, используя палитру представлений временной шкалы, масштабов и макетов, а также элементы управления для фильтрации, выделения и аннотаций. Чтобы узнать больше об исследованиях, которые послужили основой для этого проекта, см. timelinesrevisited.github.io , который включает в себя обзор инструментов временной шкалы и более 200 индивидуальных временных шкал.
Посмотрите эти примеры временных шкал и историй, созданных с помощью Timeline Storyteller.
Мэтью Бремер
Бонхсин Ли
Натали Генри Рич
Даррен Эдж
Кристофер Уайт
Катя Литвинец
Дэвид Титсворт
Клонируйте основную ветку этого репозитория: git clone https://github.com/Microsoft/timelinestoryteller.git
Убедитесь, что установлены nodejs, npm и Yarn.
Откройте терминал в корне репозитория и установите модули узла: yarn
ИЛИ npm_install
.
Создайте public/app/timelinestoryteller.js: npm test
Запустите сервер узла: npm start
Открыть локальный хост: 8000
Исходный код приложения можно найти в каталоге src/.
Этот репозиторий содержит исходный код Timeline Storyteller как отдельного веб-приложения. Чтобы создать пользовательский визуальный элемент Timeline Storyteller для Power BI, перейдите на страницу github.com/Microsoft/PowerBI-visuals-TimelineStoryteller.
Timeline Storyteller в настоящее время поддерживает наборы данных о событиях в формате CSV, JSON или Google Spreadsheet.
Каждое событие определяется следующими атрибутами:
Обязательно : start_date
, date: ГГГГ, ГГГГ-ММ-ДД или ГГГГ-ММ-ДД. Поддерживаются форматы ЧЧ:ММЗ (ISO 8601) (Z необходим для указания UTC, в противном случае ЧЧ:ММ будет зависеть от часового пояса). Допускаются даты до нашей эры, например, -27, -13800000000.
Необязательно : end_date
, date: в том же формате, что и start_date
Необязательно : category
, строка, соответствующая категории события (которую Timeline Storyteller кодирует как цвет).
Необязательно : facet
, строка, соответствующая другой категории события (которую Timeline Storyteller использует для создания фасетного макета временной шкалы; при желании category
и facet
могут быть идентичными).
Необязательно : content_text
, строковое описание события (которое Timeline Storyteller отображает как аннотации к событию).
{ "start_date":"1775", "end_date":"1783", "content_text":"American Revolutionary War: an armed struggle for secession from the British Empire by the Thirteen Colonies that would subsequently become the United States.", "facet":"North America", "category":"North America" },
строка заголовка:
start_date,end_date,content_text,facet,category
пример строки событий:
1775,1783,American Revolutionary War: an armed struggle for secession from the British Empire by the Thirteen Colonies that would subsequently become the United States.,North America,North America
Вот демонстрационный набор данных The Daily Routines of Famous Creative People, использованный в демо-версии Timeline Storyteller в Google Sheet.
Убедитесь, что таблица опубликована (откройте меню таблицы Google «Файл», выберите «Опубликовать в Интернете»).
Убедитесь, что столбцы start_date
и end_date
отформатированы как текст, а не как даты (например, '1926-06-29
).
Обязательно : URL-адрес таблицы.
Необязательно : заголовок листа (т. е. имя вкладки) для этого набора данных: dailyroutines
Введите URL-адрес электронной таблицы и заголовок листа в диалоговое окно загрузки Timeline Storyteller.
Обратите внимание, что более подробные инструкции по использованию доступны на сайте timelinestoryteller.com.
Загрузите данные временной шкалы (набор демонстрационных данных, JSON, CSV, электронную таблицу Google) или сохраненную историю временной шкалы (JSON Blob с расширением .cdc; см. шаг 6).
Выберите комбинацию представления, масштаба и макета в меню вверху экрана; действительны только некоторые комбинации; ознакомьтесь с нашими рекомендациями по выбору подходящих комбинаций для вашей истории. Наведите указатель мыши на эти параметры, чтобы просмотреть всплывающую подсказку, описывающую, чем они могут быть полезны.
Редактировать холст
Нажмите на события, чтобы добавить к ним метку content_text
; изменять размер и перемещать метки; SHIFT + щелчок, чтобы выделить события без отображения меток.
Аннотировать с подписями и изображениями; изменять размер и перемещать подписи и изображения.
Фильтруйте события по категории, аспекту или сегменту. Фильтрация путем выделения подчеркивания совпадающих событий (уменьшения акцента на несовпадающих событиях).
Вы также можете фильтровать, скрывая несовпадающие события.
Запишите текущий холст как сцену, в которой сохраняются метки, подписи и изображения. Войдите в режим воспроизведения, перейдите к предыдущей/следующей записанной сцене.
Экспортируйте текущий холст в формате PNG, SVG.
Экспортируйте сцены в виде анимированного GIF-файла или JSON Blob (расширение .cdc).
Рассказчик
Авторские права (c) Корпорация Microsoft
Все права защищены.
Лицензия MIT
Настоящим бесплатно любому лицу, получившему копию данного программного обеспечения и связанных с ним файлов документации (Программное обеспечение), предоставляется разрешение на работу с Программным обеспечением без ограничений, включая, помимо прочего, права на использование, копирование, изменение, объединение, публикацию. распространять, сублицензировать и/или продавать копии Программного обеспечения, а также разрешать лицам, которым предоставлено Программное обеспечение, делать это при соблюдении следующих условий:
Вышеупомянутое уведомление об авторских правах и настоящее уведомление о разрешении должны быть включены во все копии или существенные части Программного обеспечения.
ПРОГРАММНОЕ ОБЕСПЕЧЕНИЕ ПРЕДОСТАВЛЯЕТСЯ «КАК ЕСТЬ» , БЕЗ КАКИХ-ЛИБО ГАРАНТИЙ, ЯВНЫХ ИЛИ ПОДРАЗУМЕВАЕМЫХ, ВКЛЮЧАЯ, НО НЕ ОГРАНИЧИВАЯСЬ, ГАРАНТИЯМИ ТОВАРНОЙ ЦЕННОСТИ, ПРИГОДНОСТИ ДЛЯ ОПРЕДЕЛЕННОЙ ЦЕЛИ И НЕНАРУШЕНИЯ ПРАВ. НИ ПРИ КАКИХ ОБСТОЯТЕЛЬСТВАХ АВТОРЫ ИЛИ ОБЛАДАТЕЛИ АВТОРСКИХ ПРАВ НЕ НЕСУТ ОТВЕТСТВЕННОСТИ ЗА ЛЮБЫЕ ПРЕТЕНЗИИ, УБЫТКИ ИЛИ ДРУГУЮ ОТВЕТСТВЕННОСТЬ, БУДЬ В ДЕЙСТВИЯХ ПО КОНТРАКТУ, ПРАВОНАРУШЕНИЮ ИЛИ ДРУГИМ ОБРАЗОМ, ВОЗНИКАЮЩИЕ ОТ, ИЗ ИЛИ В СВЯЗИ С ПРОГРАММНЫМ ОБЕСПЕЧЕНИЕМ ИЛИ ИСПОЛЬЗОВАНИЕМ ИЛИ ДРУГИМИ СДЕЛКАМИ, ПРОГРАММНОЕ ОБЕСПЕЧЕНИЕ.
Если вы используете Timeline Storyteller, чтобы составить график исследовательской работы, вы можете цитировать нас двумя способами. Можно процитировать сам инструмент:
@misc{TimelineStoryteller, author = {Matthew Brehmer and Bongshin Lee and Nathalie Henry Riche and Darren Edge and Christopher White and Kate Lytvynets and David Tittsworth}, title = {Microsoft Timeline Storyteller}, year = {2017}, note = {url{https://timelinestoryteller.com}} }
Или вы можете процитировать нашу недавнюю журнальную статью о пространстве дизайна временной шкалы:
@article{Brehmer2016, author = {Matthew Brehmer and Bongshin Lee and Benjamin Bach and Nathalie Henry Riche and Tamara Munzner}, title = {Timelines Revisited: A Design Space and Considerations for Expressive Storytelling}, journal = {IEEE Transactions on Visualization and Computer Graphics (TVCG)}, year = {2017}, volume = {23}, issue = {9}, pages = {2151--2164}, doi = {10.1109/TVCG.2016.2614803}, ISSN = {1077-2626} }
Биография Пристли
Великие философы VIII века до н.э.
Крупнейшие империи в истории
Восточноазиатские династии
Эпидемии с 14 века.
Премьер-министры Канады
Президенты Франции
Канцлеры Германии
Президенты Италии
Премьер-министры Японии
Премьер-министры Великобритании
Президенты США
C4-5 Ураганы: 1960-2010 гг.
Распорядок дня известных творческих людей — «Визуализация жизни художников» от Accurat
«От первой публикации до шедевров» от Accurat
«Обратный отсчет до сингулярности» Курцвейла
«Взгляд на время» от mayra.artes для журнала Wait ButWhy
«Жизнь типичного американца» Тима Урбана для журнала Wait ButWhy
Все иконки CC BY 3.0, по названию и автору:
галочка (Артур Шлейн)
календарь (Кирилл Томилов)
временная шкала (Алекандр Бычков)
gif-файл (Пранав Гровер)
png-файл (Пранав Гровер)
svg-файл (Пранав Гровер)
json-файл (Пранав Гровер)
csv-файл (Пранав Гровер)
драйв (Денис Ключников)
сетка (Доэджо)
папка (иконочи)
фильтр (Creative Shell)
изображение (Creative Shell)
кавычка (Вероника Крпчарова)
булавка (Александр Черкинский)
ластик (Терренс Кевин Олири)
невидимка (Кид А)
книга (Сетё Ари Вибово)