Типология сетевых СМИ. 3 курс. Лабораторное занятие №2. Подгруппа 1. Визуализация статистики
Задание состоит из двух частей - создания виджета визуализации данных (1) и публикации этого виджета в виде колонки под блоком меню из предыдущего задания (2).
Часть 1.
1) Вам нужно выбрать любые открытые данные - можно, например, взять статистику челябинскстата - http://chelstat.gks.ru/ - в формате excel (минимум - два файла с различными данными).
2) Открыть сервис Tableau Public и зарегистрировать в нем аккаунт - https://public.tableau.com/s/ Затем начать работу с версией 2019 года (если у вас нет программы - скачать дистрибутив с сайта).
3) Запустить программу и выбрать данные (экспортируются из текстового файла, access или excel).
4) Оформить данные в таблице (sheet) различным образом для различных данных (у вас два варианта для минимума), распределив по колонкам и строкам.
5) Создать дэшбод-страницу (Dashboard-New Dashboard) и перенести туда таблицу (sheet 1 и sheet 2, соответственно).
6) Оформить страницу на русском языке и удалить все нулевые параметры из конечного виджета.
7) Зарегистрироваться в tableausoftware и загрузить статистику в сервис (File - Save to web).
8) Открыть дэшбод в вашем профиле и скопировать embed-код.
Часть 2.
Часть 1.
1) Вам нужно выбрать любые открытые данные - можно, например, взять статистику челябинскстата - http://chelstat.gks.ru/ - в формате excel (минимум - два файла с различными данными).
2) Открыть сервис Tableau Public и зарегистрировать в нем аккаунт - https://public.tableau.com/s/ Затем начать работу с версией 2019 года (если у вас нет программы - скачать дистрибутив с сайта).
3) Запустить программу и выбрать данные (экспортируются из текстового файла, access или excel).
4) Оформить данные в таблице (sheet) различным образом для различных данных (у вас два варианта для минимума), распределив по колонкам и строкам.
5) Создать дэшбод-страницу (Dashboard-New Dashboard) и перенести туда таблицу (sheet 1 и sheet 2, соответственно).
6) Оформить страницу на русском языке и удалить все нулевые параметры из конечного виджета.
7) Зарегистрироваться в tableausoftware и загрузить статистику в сервис (File - Save to web).
8) Открыть дэшбод в вашем профиле и скопировать embed-код.
Часть 2.
9) Для добавления простых колонок нужно добавить на страницу CSS-стиль этих колонок и указать их в HTML.
10) Внутри параметров стилей создаем идентификатор #maket и указываем в нем атрибут ширины макета в процентах ( в моем примере - 145%). После этого закрываем идентификатор
11) Обозначаем селекторы таблиц-колонок с идентификаторами левой и правой. Ширину вы задаете свою, как и фоновые цвета:
TD {
vertical-align: top;
padding: 5px;
}
TD#leftcol {
width: 800px;
background: #87ceeb;
}
TD#rightcol {
width: 500px;
background: #4169e1;
}
12) После этого задаем подвал сайта с помощью селектора footer и указываем его атрибуты: цвет (background-color), цвет текста (color) и ширину (width) в процентах (равна ширине всего макета)
13) Закрываем селектор футера и тег <style>
14) После закрытой части меню навигации задаем колонки как таблицу с идентификатором макета:
<table cellspacing="0" id="maket">
15) Внутри указываем тело таблицы с идентификатором колонки (левой и правой):
<tbody>
<tr>
<td id="leftcol">содержимое левой колонки</td>
<td id="rightcol">содержимое правой колонки</td>
</tr>
</tbody>
</table>
16) После тега </body> вставляете тег подвала страницы <footer> и указываете в нем произвольное содержимое.
17) Встраиваете виджет визуализированных данных в любую колонку, настраивая ширину виджета.
10) Внутри параметров стилей создаем идентификатор #maket и указываем в нем атрибут ширины макета в процентах ( в моем примере - 145%). После этого закрываем идентификатор
11) Обозначаем селекторы таблиц-колонок с идентификаторами левой и правой. Ширину вы задаете свою, как и фоновые цвета:
TD {
vertical-align: top;
padding: 5px;
}
TD#leftcol {
width: 800px;
background: #87ceeb;
}
TD#rightcol {
width: 500px;
background: #4169e1;
}
12) После этого задаем подвал сайта с помощью селектора footer и указываем его атрибуты: цвет (background-color), цвет текста (color) и ширину (width) в процентах (равна ширине всего макета)
13) Закрываем селектор футера и тег <style>
14) После закрытой части меню навигации задаем колонки как таблицу с идентификатором макета:
<table cellspacing="0" id="maket">
15) Внутри указываем тело таблицы с идентификатором колонки (левой и правой):
<tbody>
<tr>
<td id="leftcol">содержимое левой колонки</td>
<td id="rightcol">содержимое правой колонки</td>
</tr>
</tbody>
</table>
16) После тега </body> вставляете тег подвала страницы <footer> и указываете в нем произвольное содержимое.
17) Встраиваете виджет визуализированных данных в любую колонку, настраивая ширину виджета.
Если все верно, то у вас получится примерно такой вариант: https://konoplevtech3.blogspot.com/2019/02/css.html
Ссылки на выполненное задание принимаются в комментариях до 20:00 16 марта.
https://praktika-1.blogspot.com/2019/02/blog-post_14.html
ОтветитьУдалитьhttps://praktika1kka.blogspot.com/2019/02/blog-post_96.html
ОтветитьУдалитьОценка "отлично"
Удалитьhttps://rewrqwe.blogspot.com/2019/03/jjjjj-body-background-color-transparent_57.html
ОтветитьУдалитьПопов Сергей
Не принято. Вариант отображения статистики не несет в себе графической составляющей (слева у вас синий забор, справа - типовая таблица), сам виджет статистики снес верстку. Цвета колонок не изменены. Жду исправленный вариант.
УдалитьНе принято. В статистике есть непереименованные значения (F3, F4). Виджет со статистикой неправильно встроен - он стоит не в колонке, а над колонками. Жду исправленный вариант.
ОтветитьУдалитьhttps://borisovaanna56.blogspot.com/2019/02/menu-body-background-color-transparent.html
ОтветитьУдалитьОценка "отлично".
ОтветитьУдалить