Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Nikolaos Papathanassopoulos
Nikolaos Papathanassopoulos
10,322 Points
Posted by Nikolaos Papathanassopoulos
Nikolaos Papathanassopoulos
10,322 Points

how to do svg defs with use element?

Fellow Treehousians, I'm working on a little project dubbed "fake imagemap capability with svg" to learn more about svg techniques. The product will be used by a professor of my friend (#10), who wants to learn his students names with ease.

Im trying to display the reocurring circles by using the 

<defs>

and 

<use>

element of 

<svg>

. Unfortunately it wont display properly (width and height stay zero).

TL'DR? Check out this svg at my website and tell me what's wrong with it:

http://papathan.de/namenlernen/imagemap.svg

Best Regards, Niksda

John Domingo
John Domingo
9,058 Points
John Domingo
John Domingo
9,058 Points

This is my first time seeing defs and use elements but I'm excited to learn more.

I am not sure if this helps but you might have to make the set the use elements' xlink:href atrribues to '#punkt' and not just 'punkt'.

Source: SVG Use Element | Jenkov Tutorials