--- id: 587d7faa367417b2b2512bd6 title: Adicionar uma dica a um elemento D3 challengeType: 6 forumTopicId: 301470 dashedName: add-a-tooltip-to-a-d3-element --- # --description-- Uma dica mostra mais informações sobre um item em uma página quando o usuário passa o mouse por cima do item. Existem várias maneiras de adicionar uma dica a uma visualização. Este desafio usa o elemento SVG `title`. `title` está junto com o método `text()` para adicionar dinamicamente dados às barras. # --instructions-- Acrescente um elemento `title` sob cada nó de `rect`. Em seguida, chame o método `text()` com uma função de callback para que o texto mostre o valor dos dados. # --hints-- O código deve ter 9 elementos `title`. ```js assert($('title').length == 9); ``` O primeiro elemento `title` deve ter o texto de dica `12`. ```js assert($('title').eq(0).text() == '12'); ``` O segundo elemento `title` deve ter o texto de dica `31`. ```js assert($('title').eq(1).text() == '31'); ``` O terceiro elemento `title` deve ter o texto de dica `22`. ```js assert($('title').eq(2).text() == '22'); ``` O quarto elemento `title` deve ter o texto de dica `17`. ```js assert($('title').eq(3).text() == '17'); ``` O quinto elemento `title` deve ter o texto de dica `25`. ```js assert($('title').eq(4).text() == '25'); ``` O sexto elemento `title` deve ter o texto de dica `18`. ```js assert($('title').eq(5).text() == '18'); ``` O sétimo elemento `title` deve ter o texto de dica `29`. ```js assert($('title').eq(6).text() == '29'); ``` O oitavo elemento `title` deve ter o texto de dica `14`. ```js assert($('title').eq(7).text() == '14'); ``` O nono elemento `title` deve ter o texto de dica `9`. ```js assert($('title').eq(8).text() == '9'); ``` # --seed-- ## --seed-contents-- ```html ``` # --solutions-- ```html ```