6.2 KiB
6.2 KiB
id | title | isRequired | challengeType | videoUrl | localeTitle |
---|---|---|---|---|---|
587d7fa6367417b2b2512bc0 | Visualize Data with a Treemap Diagram | true | 3 | Визуализация данных с диаграммой карт |
Description
id="title"
. User Story # 2: Моя древовидная карта должна иметь описание с соответствующим id="description"
. User Story # 3: Моя карта деревьев должна иметь rect
элементы с соответствующим class="tile"
которые представляют данные. User Story # 4: Для плиток должно быть не менее двух разных цветов заливки. User Story # 5: Каждая плитка должна иметь свойства data-name
, data-category
и data-value
содержащие их соответствующее имя, категорию и значение. User Story # 6: Площадь каждой плитки должна соответствовать размеру данных: плитки с большим значением данных должны иметь большую площадь. User Story # 7: Моя карта деревьев должна иметь легенду с соответствующим id="legend"
. User Story # 8: Моя легенда должна иметь rect
элементы с соответствующим class="legend-item"
. User Story # 9: rect
элементы в легенде должны использовать как минимум 2 разных цвета заливки. User Story # 10: Я могу навести курсор мыши на область и увидеть всплывающую подсказку с соответствующей id="tooltip"
которая отображает больше информации о области. User Story # 11: Моя подсказка должна иметь свойство data-value
, соответствующее data-value
данных активной области. Для этого проекта вы можете использовать любой из следующих наборов данных: - Kickstarter Pledges:
https://cdn.rawgit.com/freeCodeCamp/testable-projects-fcc/a80ce8f9/src/data/tree_map/kickstarter-funding-data.json
- Продажа фильмов:
https://cdn.rawgit.com/freeCodeCamp/testable-projects-fcc/a80ce8f9/src/data/tree_map/movie-data.json
- Продажа видеоигр:
https://cdn.rawgit.com/freeCodeCamp/testable-projects-fcc/a80ce8f9/src/data/tree_map/video-game-sales-data.json
https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js
Как только вы закончите, отправьте URL-адрес своей рабочей проект с прохождением всех его тестов. Не забудьте использовать метод Read-Search-Ask, если вы застряли. Instructions
undefined
Tests
tests: []
Challenge Seed
Solution
// solution required