--- id: 587d7faa367417b2b2512bd6 title: Add a Tooltip to a D3 Element challengeType: 6 videoUrl: '' localeTitle: Добавление всплывающей подсказки к элементу D3 --- ## Description
Всплывающая подсказка показывает дополнительную информацию об элементе на странице, когда пользователь наводит курсор на этот элемент. Существует несколько способов добавления всплывающей подсказки к визуализации, эта задача использует элемент title SVG. title с методом text() для динамического добавления данных в столбцы.
## Instructions
Добавляйте элемент title под каждым rect узлом. Затем вызовите метод text() с функцией обратного вызова, чтобы текст отображал значение данных.
## Tests
```yml tests: - text: Ваш код должен содержать 9 элементов title . testString: 'assert($("title").length == 9, "Your code should have 9 title elements.");' - text: Первый элемент title должен иметь текст всплывающей подсказки 12. testString: 'assert($("title").eq(0).text() == "12", "The first title element should have tooltip text of 12.");' - text: '' testString: 'assert($("title").eq(1).text() == "31", "The second title element should have tooltip text of 31.");' - text: '' testString: 'assert($("title").eq(2).text() == "22", "The third title element should have tooltip text of 22.");' - text: '' testString: 'assert($("title").eq(3).text() == "17", "The fourth title element should have tooltip text of 17.");' - text: '' testString: 'assert($("title").eq(4).text() == "25", "The fifth title element should have tooltip text of 25.");' - text: '' testString: 'assert($("title").eq(5).text() == "18", "The sixth title element should have tooltip text of 18.");' - text: '' testString: 'assert($("title").eq(6).text() == "29", "The seventh title element should have tooltip text of 29.");' - text: '' testString: 'assert($("title").eq(7).text() == "14", "The eighth title element should have tooltip text of 14.");' - text: '' testString: 'assert($("title").eq(8).text() == "9", "The ninth title element should have tooltip text of 9.");' ```
## Challenge Seed
```html ```
## Solution
```js // solution required ```