A vector image is determined by mathematical equations and not by pixels. Therefore, the image can be zoomed in at any magnification and is still smooth. There is no pixelation because there are no pixels to reveal under high magnifications.
An svg file is a type of vector file. It is designed to be displayed by all modern web browsers. The advantage of an svg image file is it is very small in size. In fact, calling it a file is not even correct. Calling an svg file a file is like calling the letters in this paragraph a file. Basically an svg "file" consists of nothing more than a bunch of texts telling the browser how to "draw" an image on-the-fly. Imagine your telling the web browser to display an svg rendition of a circle. The svg code is basically a glorified equation for a circle which is as seen on the left.Incidentally, the image on the left is a bitmap image. If you zoom in, you will see all of the static pixels or building blocks that make up the image.
If the browser supports svg, then it will display a picture of a circle. In fact, it will display a picture of a perfect circle. When you zoom into this svg circle image, the curve never shows pixelation.
Test this out with the two images on the left. At first glance, they look exactly the same. However, when you zoom in by telling your web browser to zoom in, you will see which one of them is a bitmap image and which is a vector image. As said, a vector image that is rendered in a web browser is an svg file.In case you are curious what is the actual svg equations that would cause the web browser to render this image, just look at the HTML code that creates this post. Look for a tag that says SVG. You will see all kinds of weird texts and numbers. This is a much more complex version of the simple circle equation.
More info on vector vs bit map can be found here:
http://packetrider.blogspot.com/2014/11/a-free-browser-based-vector-creator.html
No comments:
Post a Comment