MM Topic 2 - Bit mapped and Vector Graphics Data 1 Topic 2 – Bit mapped & Vector graphics Still images – the general name for any graphic that doesn’t change (unless edited). It is static compared to a video clip in that it does alter with the passage of time. Digital Camera Hardware required to capture an image. Digital cameras store images as bit map ie. a grid of pixels. Inside at the back of the camera is a grid/array of small circuits called Charge Coupled Devices (CCDs). This is basically a grid of light sensitive cells. Each cell measures how much red, green and blue light there was when a photograph is taken. Each CCD stores information about one pixel.

MM Topic 2 - Bit mapped and Vector Graphics Data 2 An analogue to digital converter (ADC) changes the amount of light into electrical format which is then stored in binary. The image can be viewed on the camera’s screen and can be deleted if required. The image is stored on a memory card – they can store a lot of information, are small and portable. The card can be taken to a shop where a special reader can be used to produce the photographs. Special effects or changes can be applied to the image using photo editing software on a computer. The images can be printed. Disadvantages – special paper required and a lot of ink is used.

MM Topic 2 - Bit mapped and Vector Graphics Data 3 Scanner (Flatbed or handheld) Flatbed Scanner The document to be scanned is placed on a glass plate. Below the plate a lamp is used to illuminate the page. A scan head moves slowly across the page. The amount of light reflected is focused through a lens onto a line of CCDs (linear CCDs). The ADC converts the amount of reflected light into electrical format then this is stored as binary. Once one line has been scanned, it is sent to the computer’s RAM and displayed on the monitor. The scan head moves down and scans the next line. The process is repeated until the whole document has been scanned.

MM Topic 2 - Bit mapped and Vector Graphics Data 4 Bit Mapped Graphic – one that is stored dot by dot called pixels (short for picture element) To be able to represent colours, a computer must use more than one bit per pixel. The number of bits in each pixel is called the colour depth or bit depth. Colour depth of three – 8 colours Binary Code Colour 000white 001cream 010yellow 011brown 100blue 101red 110 grey 111black Rule To Learn The number of colours = 2 bit depth Eg a bit depth of 5 would give 2 5 colours = 2x2x2x2x2 = 32 colours

MM Topic 2 - Bit mapped and Vector Graphics Data 5 True Colour – when a bit mapped image uses 24 bits (3 bytes) for each pixel (approx 16 million colours). This is reckoned to be the number of colours perceived by the human eye. All displayed colours are made up of the three primary colours – Red, Green and Blue (RGB). The first byte in true colour contains details about the amount of red, the second byte stores the amount of green and the third byte the amount of blue. Each pixel contains a binary code but how can this be translated into a colour? Colour Look Up Table (CLUT) or Indexed Colour A CLUT is a table of colours. Each colour has an index position eg. Red might be in position 5. The binary code in each pixel represents a numbered entry in the table. The computer looks at each pixel, looks at what index entry is contained in that pixel then the colour in that position.

MM Topic 2 - Bit mapped and Vector Graphics Data 6 Compression Bit mapped files can be very large because of the number of pixels and large colour depth. Compression – to reduce the size of a file either by; using an algorithm (mathematical calculation) or using a special piece of software designed to make files smaller or by saving a file in a format that compresses data. Two types of compression; Lossy – when a file is reduced some data is lost in the process. The compressed file is of poorer quality. Lossless – when a file is reduced no data is lost. The data is simply stored more efficiently.

MM Topic 2 - Bit mapped and Vector Graphics Data 7 Compression cont. Run Length Encoding (RLE) Built in form of compression. In many images there are larges stretches of adjacent pixels that are exactly the same colour. In RLE the number of pixels a colour stretches for is stored in a special byte called a keybyte instead of storing each of these pixels separately.

MM Topic 2 - Bit mapped and Vector Graphics Data 8 2. LZW technique used. Looks for repeating data. Continuous blocks of identical colours are stored more efficiently. Eg. Instead of storing ‘red, red, red, red, red’ - ‘5 red’ is stored in a dictionary of patterns then pointers are used to point to the dictionary. GIF reduces the file size in two ways; 1. Bit depth is reduced to 8 (256 colours). GIF not used for photographs. Lossless – no data is lost in compression. Advantages; 1. Each colour only needs to be stored once 2. The pointers to the dictionary entries take up less memory than binary codes for colours. 3. The dictionary is not stored with the file, but is generated by the piece of software being used to open the image. GIF (Graphics Interchange Format) for storing compressed graphics

MM Topic 2 - Bit mapped and Vector Graphics Data 9 GIF – additional features Transparency – areas of the image are transparent. Animation – GIF images can be played one after the other as an animation. GIF format used on web pages – two versions available; 1. Non-interlaced – the picture downloads on e line of pixels at a time and gradually builds the image up. The image can take a while to appear especially with dial-up connections. 2. Interlaced – a fuzzy image of the whole picture is downloaded. More data is then received until the picture is completed and becomes clear. Good for larger images.

MM Topic 2 - Bit mapped and Vector Graphics Data 10 GIF format Good format for; Images with few colours. Images with flat areas of colour. Animated images. Images which need transparent areas. Poor format for; Photographs High quality pictures High quality videos

MM Topic 2 - Bit mapped and Vector Graphics Data 11 Compression cont. PNG (Portable Network Graphics) for storing compressed graphics Lossless – no data is lost in compression. Compresses by looking for adjacent colours but allows the user to vary the reduction of colours from 256 to 16 million. PNGs can be non-interlaced or interlaced Allows transparency PNG cannot be animated

MM Topic 2 - Bit mapped and Vector Graphics Data 12 JPEG (Joint Photographic Expert Group) for compressing files Compression cont. Main standard for compressing high quality images and photos Uses a mathematical formula to look for and remove colours that won’t be noticed by the human eye. Lossy compression The level of the compression can be varied to reduce file size further but quality may also be reduced. Does not support interlacing or transparency.

MM Topic 2 - Bit mapped and Vector Graphics Data 13 Technical Terms Dithering – uses a combination of colours to create an illusion of having additional colours. This improves the appearance of an image and simulates more colours than there are available. Anti-aliasing – the graphic has its edges slightly blurred and mixed with background colours to eliminate the jagged edges that can occur.

MM Topic 2 - Bit mapped and Vector Graphics Data 14 Calculating File Sizes File Size = Resolution x Colour Depth Height x Width or PixelsNumber of Bits

MM Topic 2 - Bit mapped and Vector Graphics Data 15 Output Hardware Inside the computer a graphics card has the task of generating the images. The card has the following components; GPU – to perform complex calculations each time a complex graphic is drawn freeing the computer’s main processor. Memory – called VRAM (video RAM) to store the images to be displayed instead of the computer’s RAM. More VRAM means higher colour depth and resolution. Digital to Analogue Converter (DAC) – converts the digital computer signal into an analogue electrical signal which can be displayed on the monitor. MonitorsCRT – Cathode Ray Tube LCD – Liquid Crystal Display TFT – Thin Film Transistor End of Topic 2

MM Topic 2 - Bit mapped and Vector Graphics Data 16 Vector Graphics Data Vector drawn graphics (object oriented graphics) works by creating objects (lines/shapes) and defining them mathematically. When that object is saved, all that is actually saved is a formula which describes that shape’s attributes. Common attributes of vector graphics objects; shaperotation positionline sizefill

MM Topic 2 - Bit mapped and Vector Graphics Data 17 Advantages of using Vector Drawn Graphics Can be scaled to large sizes, keeping original quality and file size. (Resolution Independent) Relatively small file sizes Individual objects can be edited. Easily converted to bitmapped

MM Topic 2 - Bit mapped and Vector Graphics Data 18 Drawbacks of using Vector Drawn Graphics Difficult to recreate realistic images. Only individual objects can be edited not pixel by pixel. Dependent on hardware & software for appearance & quality.

MM Topic 2 - Bit mapped and Vector Graphics Data 19 The most common standard file format for object- orientated graphics is called SVG (Scalable Vector Graphics). This is the format used for vector images that appear on the internet. The quality of a vector graphic is not affected when resized because; The vector graphics stores the attributes of each object and the object is drawn again at it new size. This means that it will always be displayed at the best possible resolution for the output device.

MM Topic 2 - Bit mapped and Vector Graphics Data 20 3D Vector Images A 3D vector image is store as a description with all the attributes associated with 2D images, such as type of shape, fill colour and dimensions. In addition other attributes need to be stored, and these include; the angle of rotation surface texture (bit mapped patterns to cover a surface) shadows

MM Topic 2 - Bit mapped and Vector Graphics Data 21 VRML (Virtual Reality Modelling or Mark-up Language) VRML is a standard for describing interactive three- dimensional vector images. VRML is capable of representing static and animated dynamic 3D and multimedia objects. Each object in the file is known as a node. The properties or attributes of the objects are known as the fields. WRL (World Representation Language) is a file type for 3D vectors.