From Test-Scratch-Wiki
Raster graphics, also called bitmap graphics, are graphics stored and rendered as arrays of pixels. Though this method of storage is simpler, it is slower with large images since many pixels need to be stored. For example, the Scratch Stage stored as a raster image would be 360*480=172800 pixels, and each pixel has 4 integers associated with it (corresponding to three colors and a transparency factor).
Use in Scratch
In Scratch 1.4, and all previous versions, raster graphics were exclusively used. The Scratch 2.0 Paint Editor supports both raster and vector graphics, though many features of the Scratch 2.0 user interface, notably the blocks, use vector graphics unlike Scratch 1.4's.
File Types
Filetypes that store raster images fall under one of three categories: uncompressed, lossy compressed (visual data is lost with compression), and lossless compressed (image is compressed, but no visual data changes). The first category includes BMP and some types of TIFF and it stores image data without any compression at all. JPEG and some types of TIFF are examples of lossy compression, which causes visible artifacts especially in simple images. Lossless compression makes a file look the same as its uncompressed counterpart but with a smaller filesize, and examples include some types of TIFF, PNG, and GIF (for 256-colour images).
Netpbm File Format
Netpbm is an uncompressed image file format similar to BMP. It was originally invented in the 1980s by Jef Poskanzer so that images could survive changes to ASCII text in an email message. Images in general, including the ones Scratch support, share similarities.
Example 1
Here is an example image and its code:
Magnified 20 times:
P1 # This is an example bitmap of the letter "K" # The 6 and 10 are the width and height of the image. 6 10 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 1 0 1 0 0 1 0 0 1 0 1 0 0 0 1 1 0 0 0 0 1 0 1 0 0 0 1 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0
P1 specifies that the image will be solely black and white, and the 6 and 10 are the width and height of the image, respectively. The array of numbers after that is the array of pixels used in the image. Each array element always corresponds to a specific pixel. For example, an element in the top right corner of the array is the same pixel as the one in the top right corner of the image.
Also, since P1 means that the color depth is black&white, 1 stands for black, and 0 stands for white.
Example 2
Here is another example of an image:
Magnified 20 times:
P2 # An example of some art. # This image is 6 pixels wide and 10 pixels tall. # The color depth goes from 0 to 15. 6 10 15 0 0 0 0 0 0 0 3 0 0 3 0 0 0 3 3 0 0 0 0 3 3 0 0 0 0 0 0 0 0 3 3 3 3 3 0 6 6 6 6 3 0 9 9 9 6 3 0 12 12 9 6 3 0 15 12 9 6 3 0
For the most part, the top of the image file is formatted the same way as in Example 1. P2 constitutes that the image will be graymap, meaning that it will be made of black, white, and grey pixels. The 6 and 10 are once again the width and height of the image. The one major change though is the addition of the 15. This specifies that the color depth of the image ranges from 0 to 15, with 15 being black, and 0 being white. Values closer to 0 will be lighter, and values closer to 15 will be darker.
Example 3
Here is a final example:
Magnified 40 times:
P3 # The P3 means colors are stored in pixmap. # The image is 3 pixels wide and 2 pixels high. # The color depth is 255. 3 2 255 0 0 0 255 0 0 0 255 0 0 255 255 255 255 0 255 255 255
This image is again close to the same as Example 2, but each pixel is now represented by three numbers. The first number is the amount of red in the pixel, the second number is the amount of green, and the third is the amount of blue. The color depth works exactly like it did in example 2, though now it is the cap for three numbers. For example, if a color depth of 10 is used, then 10 0 0 would become red.
Other than that, the P3 means that the image is pixmap, or in other words, stored with colors. The 3 and 2 specify the size of the image, the 255 specifies the color depth, and the image's pixels are stored right after that.
See Also
- Pixels
- Paint Editor
- Vector Graphics
- Raster graphics on Wikipedia
