Like, Vector images are made of separate shapes instead of pixels, but how does it produce an image on a screen if the screen is covered in pixels?
In: Technology
There is a process to convert a vector image to pixels… you draw the lines, curves, etc that the vectors call for, fill in the regions, etc. into the pixels.
What matters is that at any point, you can provide a bigger or smaller grid of pixels and ask it to do so again, and it will. Being drawn as pixels doesn’t damage the original vectors…
Or you can zoom in and re-draw a smaller region and turn them into pixels. Each time the image is drawn fresh, from the original vector data.
Yes, your screen is always the limiting factor in what image the computer can show the user. But the internal representation is what matters, and what the artist is working with. Circles are round, the curve is smooth, lines a thin and crisp, no matter much far you zoom in because the vector will always be drawn that way.
Vector files can be upscaled with no loss of quality, which is useful for printing or producing files for large displays.
There are, basically, two kinds of images – bitmaps and vectors.
Bitmaps are, as the name implies, maps of bits. They’re also sometimes called rasters. They’re instructions that describe each pixel, line by line. If you have a 100×100 picture, it will contain instructions on what each of the 10.000 pixels should look like.
A vector image is math. Instead of containing information on the individual pixels, it contains instructions on how to draw it. In more human terms, it might say “there’s a black line that starts at coordinates 20,40 and ends at 40,40.”
This means they can be scaled infinitely. If you make a bitmap bigger, you simply take the individual squares and expand them. There’s no way to know what’s in-between – but a drawing instruction can be made as little or as big as you want.
The previous line may have been from a 100×100 size originally, but if you need to upscale it to 1000×1000, your computer can just multiply each coordinate by 10, and you’ll get the same picture.
In some sense a vector file doesn’t actually contain an image, but rather a set of instructions for producing the image – essentially a program in a specialized programming language that, when executed against a given “canvas” will produce the actual pixels. Scaling up or down just changes the size of the canvas, and the program is run again.
2 things.
1. A vector image is just an image where instead of storing what pixels are what color, you store the information about the shapes and lines in non-absolute terms. So instead of a 800×800 px image, you have an image that starts at 0%,0% and goes all the way to 100%, 100%.
2. The computer program turns that information into pixels by just translating the relative positions into absolute terms. So an 800×800 image where a line starts at 50% would mean it starts at 400×400. If you want a 5kx5k image, the line starts at 2500 px instead of 800
If you tell your computer place these 300 pixels in a circle, then you stretch out that circle, the pixels will get further apart. If you tell your computer, here’s the equation for a circle, draw it. The circle will always have the correct number of pixels for the display size.
All modern PC screens are raster displays. Your computer draws pixels, even when drawing a vector image.
The difference between raster and vector *data*, is as you’ve described. Raster images are like a mosaic, where each pixel has a defined location and color value. Vector images are like a set of instructions for drawing geometry.
We call vectors “lossless” because the computer has no trouble drawing this geometry data at different scales. You can zoom into a vector .SVG of a blue circle, and the perimeter of the circle will always look sharp because the computer is deciding where to put the pixels.
Raster data, by contrast, defines exactly where its pixels are. The computer simply follows these instructions. When you zoom in on a raster image, the computer scales these pixels up in size until the image looks blocky.
Vector images are the instructions on how to draw something regardless of size, regular images are already drawn and at a set size
ELI5 explanation of how rasters are lossy:
Take a transparent projector sheet with a grid on it and lay it over a sheet of paper with a line drawn across it. Color in every grid square the line touches with a marker. The squares you filled approximate the line and you can tell roughly what its length and angle are, but you could also draw slightly different lines that would create the exact same grid.
Explaining why vectors are lossless requires perhaps 4th grade math.
Contrast the idea of this grid-filling with slope-intercept form (y = mx + b) Given instructions in this form, you can draw a line on a graph, and no matter how big or small the grid, it’s easy to follow the instructions and end up with the line that was intended. You can guarantee none of the information is lost because the line is generated from the instructions that were provided.
To put it another way:
* A line will produce a specific set of filled in squares on a grid…
* But that set of squares could be described by multiple lines. Not knowing which specific line was intended IS the loss of information.
* A set of instructions like “y = 2x + 3” produces the exact same line every time. This is what vectors are, and because the instructions are preserved and tell you EVERYTHING about the shape, no information can be lost.
FTR “vector images” are technically lossy. They are millions of times better than pixel images. Instead of the pixels and color data, they have instructions on how to draw the image using primitives like lines, compass, and splines.
They use floating point numbers to describe angles and distances. So they can be incredibly more accurate and scalable than pixel based methods, but there are still limits to the accuracy of such numbers. If you zoom in far enough into your image, you will eventually find points and lines not matching up perfectly.
Latest Answers