Books/Tutorials to Learn SVG [closed]

2019-01-21 15:13发布

问题:

Does anyone here know SVG? If so, how did you learn it?

Any books/tutorial pointer will be beneficial. Also I am a programmer, not a designer, so I want to pick up some skills there too.

回答1:

I learned it developing SVG Tiny software, mostly by reading the spec. SVG Tiny is basically a subset of full SVG and is focused on use in mobile phones and other "devices".

Adding to the links from previous answers, KevLinDev has a bunch of beginner-friendly tutorials.

EDIT: Removed Ikivo Animator link, since it is now leading to an entirely different kind of site.



回答2:

One method that you might want to try is by direct experimentation. Inkscape is an open source SVG editor that lets you directly view and manipulate the XML tree while editing graphically. So in this way, you can experiment with things and see how they affect the XML that gets generated.



回答3:

You could have a look at the SVG tutorial at w3schools. They also have a SVG reference there.

Another very good source is SelfSVG, but it is in german.



回答4:

The best reference book I've seen on SVG is SVG Essentials by J. David Eisenberg. I used that book to learn SVG. I also used Firefox to view SVGs and Inkscape to create them.



回答5:

http://en.wikibooks.org/wiki/SVG might help.



回答6:

I learned it with the spec: Scalable Vector Graphics on W3C. See SVG 1.1 specification. A bit dry, but that's the real thing. They also provide lot of links to resources.
Of course, I recommend to read the XML specification first... :-) A bit of JavaScript knowledge can help too.



回答7:

In answer to your question: Yes, I do know SVG - or at least a subset of it.

How I learnt it: I had a specific task I wanted to solve and SVG seemed like the easiest course. It was a mapping system so I needed a small subset of the functions and then to output the image as jpg. For that I used Batik, looking through their examples, seeing how the images are constructed in XML is surprisingly helpful and asking questions on forums/mailing lists. Also making mistakes is helpful, if frustrating at times.



回答8:

I found SVGbasics to be a good starting point. I second Rich's choice for SVG Essentials.

And for the ultimate details you want to have the SVG specification within reach. As specifications go it's a rather dull read, but it contains a number of examples too.



回答9:

You can practice SVG paths with this utility: Spark Path Utility



标签: graphics svg