Eleven colors and rasters. Color objects [color name] Returns color with the specified name [color red green blue] Returns color with the specified amounts.

Slides:



Advertisements
Similar presentations
Coordinatate systems are used to assign numeric values to locations with respect to a particular frame of reference commonly referred to as the origin.
Advertisements

Information Representation
Picture Manipulation The manipulation of (already created) pictures. May be applied to vector graphics or bitmaps. We will consider bitmaps and introduce.
Dale & Lewis Chapter 3 Data Representation. Representing color Similarly to how color is perceived in the human eye, color information is encoded in combinations.
Six compound procedures and higher-order procedures.
Four simple expressions in meta. Data objects Pieces of data in a computer are called objects Today, we’ll talk about four kinds of objects Numbers Pictures.
Fourteen lists and compound data. Some primitive data types Integers (whole numbers) 1, 2, 3, -1, 0, , etc. “Floating-point” numbers ,
Graphics File Formats. 2 Graphics Data n Vector data –Lines –Polygons –Curves n Bitmap data –Array of pixels –Numerical values corresponding to gray-
Eleven colors and rasters. Color objects Meta represents colors with color objects You can create a color by saying: [color r g b] r: amount of red (0-255)
Basic Math Vectors and Scalars Addition/Subtraction of Vectors Unit Vectors Dot Product.
Twelve painting with procedures. Overview Making shaded images with procedures Making a more elegant language Making textures with noise functions.
Four simple expressions in meta. Data objects Pieces of data in a computer are called objects Today, we’ll talk about four kinds of objects Numbers Pictures.
Eighteen painting with procedures. Review [bitmap-from-procedure procedure width height] Returns a bitmap width pixels by height pixels Obtains colors.
Seven measuring the world (geo/metry). Measuring space This course is fundamentally about spaces of various kinds Physical space Image space Auditory.
11-1 Display Technologies Hi-resolution displays come in two types: –Each takes an input signal and creates a visible image Cathode ray tube (CRT) - Streams.
Eleven colors and rasters. Color objects Meta represents colors with color objects You can create a color by saying: [color r g b] r: amount of red (0-255)
Graphics and Animation Chapter 8. 8 Graphics in Multimedia Graphics are an element that virtually all multimedia applications include.
How Images are Represented Bitmap images (Dots used to draw the image) Monochrome images 8 bit grey scale images 24 bit colour Colour lookup tables Vector.
ICS 61 - Graphics. Light Color Wheel Color Perception.
©Brooks/Cole, 2003 Chapter 2 Data Representation.
MULTIMEDIA M U A T H H U M A I D R a s h A t a l l a h.
Chapter 3 Vectors Coordinate Systems Used to describe the position of a point in space Coordinate system consists of A fixed reference point called.
Computer Graphics Using “ Adobe Photoshop ” Introduction to E-Learning Center, DAD presents Workshop on Instructor: Mazhar.
Lab #5-6 Follow-Up: More Python; Images Images ● A signal (e.g. sound, temperature infrared sensor reading) is a single (one- dimensional) quantity that.
Images Data Representation. Objectives  Understand the terms bitmap & pixel  Understand how bitmap images are stored using binary in a computer system.
© 1999 Rochester Institute of Technology Introduction to Digital Imaging.
Nov 061 Size Control How is a component’s size determined during layout and during resize operations? Three factors determine component sizes: The component’s.
Copyright © 2009 Curt Hill The Picture Object Getting and displaying.
Graphics and Animation Multimedia Projects Part 2.
September 21, COMPUTER VISION WEB PAGE IS UP !! OR Simply go to computer science homepage.
VECTORS. A vector is a quantity that has both magnitude and direction. It is represented by an arrow. The length of the vector represents the magnitude.
Kinematics and Dynamics
Intelligent Vision Systems Image Geometry and Acquisition ENT 496 Ms. HEMA C.R. Lecture 2.
Graphics. Graphic is the important media used to show the appearance of integrative media applications. According to DBP dictionary, graphics mean drawing.
CS- 375 Graphics and Human Computer Interaction Lecture 1: 12/4/1435 Fundamental Techniques in Graphics Lecturer: Kawther Abas.
The Rendering Pipeline CS 445/645 Introduction to Computer Graphics David Luebke, Spring 2003.
3461 Output Model A picture is worth a thousand words.
Digital Media Dr. Jim Rowan ITEC So far… We have compared bitmapped graphics and vector graphics We have discussed bitmapped images, some file formats.
Lecture 7: Intro to Computer Graphics. Remember…… DIGITAL - Digital means discrete. DIGITAL - Digital means discrete. Digital representation is comprised.
Multimedia. What is a graphic?  A graphic can be a: Chart Drawing Painting Photograph Logo Navigation button Diagram.
Introduction to Computer Graphics
CSCI-100 Introduction to Computing Hardware Part II.
Data Representation. What is data? Data is information that has been translated into a form that is more convenient to process As information take different.
BC ASSIGNMENT NO 5 HABEEB UR REHMAN HABEEB UR REHMAN.
Computer Science 121 Scientific Computing Winter 2014 Chapter 14 Images.
8 Graphics Digital Media I. What is a graphic? A graphic can be a:  Chart  Drawing  Painting  Photograph  Logo  Navigation button  Diagram.
Intelligent Vision Systems Image Geometry and Acquisition ENT 496 Ms. HEMA C.R. Lecture 2.
Image File Formats By Dr. Rajeev Srivastava 1. Image File Formats Header and Image data. A typical image file format contains two fields namely Dr. Rajeev.
Vectors Some quantities can be described with only a number. These quantities have magnitude (amount) only and are referred to as scalar quantities. Scalar.
2/28/2016 CS 551 / 645: Introductory Computer Graphics Framebuffer Mathematical Foundations The Rendering Pipeline.
Scanner Scanner Introduction: Scanner is an input device. It reads the graphical images or line art or text from the source and converts.
Graphics and Image Data Representations 1. Q1 How images are represented in a computer system? 2.
Chapter 3 Lecture 5: Vectors HW1 (problems): 1.18, 1.27, 2.11, 2.17, 2.21, 2.35, 2.51, 2.67 Due Thursday, Feb. 11.
Mohammed AM Dwikat CIS Department Digital Image.
Coordinatate systems are used to assign numeric values to locations with respect to a particular frame of reference commonly referred to as the origin.
Graphics 1 Graphics 2 Color 2 I Spy 1pt 1 pt 1 pt 1pt 1 pt 2 pt 2 pt
high-level operations on pictures
Binary Representation in Audio and Images
Outline Addition and subtraction of vectors Vector decomposition
painting with procedures
CS Computer Graphics Valdosta State University, Spring 2018
LET’S LEARN ABOUT GRAPHICS!
6th Lecture – Rectangles and Regions, and intro to Bitmap Images
Computer Graphics Using “Adobe Photoshop”
Representing Images 2.6 – Data Representation.
Ch2: Data Representation
Digital Media Dr. Jim Rowan ITEC 2110.
Multimedia System Image
Multimedia Graphics.
WJEC GCSE Computer Science
Presentation transcript:

eleven colors and rasters

Color objects [color name] Returns color with the specified name [color red green blue] Returns color with the specified amounts of red, green, and blue light Arguments should be [red c] or c.R [green c] or c.G [blue c] or c.B Returns the amount of red/green/blue light in the color c

Color operations [+ color color] Adds together the light of the two colors to form a new color [× number color], [ ⁄ color number] Brightens/dims color by the factor number [intensity color] Returns the total amount of light in the color from This was called brightness in assignment 3 [gray intensity] Returns a neutral gray color with the specified intensity (0-255)

Vectors (aka points) Used to represent positions in the image or displacements between positions [vector x y] or: [point x y] Returns a vector object with the specified coordinates [vector-x p] or: [point-x p], p.X [vector-y p] or: [point-y p], p.Y Returns x (or y) coordinate of p

Vector operations [+ vector vector], [− vector vector] Returns the sum/difference of two vectors (points) Sum shifts the first vector over by the amount of the second vector (or vice-versa) Difference shifts the first one back [× number vector], [ ⁄ vector number] Returns vector stretched/shrunk by a factor of number [rotate-vector vector angle] [rotate-vector-degrees vector angle] Rotates the vector about the origin [magnitude vector] Returns the length of the vector vector

What’s the difference between a vector and a point? In this class, the terms are interchangeable Both are used in the literature They technically mean slightly different things, but the distinctions don’t matter for this class We’re teaching you both terms, but you don’t need to worry about them I’ll adopt the convention of using [point x y] when I really mean a position in the image [vector x y] when I mean a shift or a direction, but not a specific position in the image I don’t care whether you follow this convention

The “dot” product [dot p 1 p 2 ] Definitions: The distance p 1 extends in the direction of p 2 (if p 2 has length 1) The distance p 2 extends in the direction of p 1 (if p 1 has length 1) [+ [× p 1.X p 2.X] [× p 1.Y p 2.Y]] [× [magnitude p 1 ] [magnitude p 2 ] [cos [angle-between p 1 p 2 ]]] Also known as Projection Scalar product Inner product Enigmatic But very common in graphics, signal processing (music), statistics Measures Similarity between vectors p 1 and p 2 Distance p 1 extends in the direction of p2 (or vice-versa) When p 1 is one unit long (i.e. a “unit vector”) Returns the number of units p 2 extends in the direction of p 1. Modern video cards have special hardware to compute dot products as fast as possible

Dot product examples X axis Y axis p 1 = [vector 1 0] p 2 = [vector 1.5 3] p 3 = [vector 0 2] [dot p 1 p 2 ] = 1×1.5+0×3 = 1.5 [dot p 1 p 3 ] = 1×0 + 0×2 = 0 [dot p3 p2] = 0×1.5+2×3 = 6 ←1.5 units →

Rasters (a.k.a. bitmaps) A bitmap is a specific kind of data object that represents an image E.g. JPEG files, GIF files, paint files But not like draw programs or the pictures we’ve been making so far Has a prespecified width and height (in pixels) It allows you to explicitly retrieve (or change) the color at each pixel

Bitmap procedures [new Bitmap string] Reads in the the jpeg or gif file with name string Converts it to internal bitmap format and returns it [height bitmap], [width bitmap] Returns the width/height of a bitmap, in pixels [pixel bitmap x y] Returns the specified pixel of the bitmap [bitmap-from-procedure procedure width height] Makes a bitmap of size width×height Repeatedly calls procedure with the location (a point) of each pixel to get the color of the pixel

Example The procedure [p → [color p.X p.X p.X]] Returns a color with equal amounts of red, green, and blue light So it’s grey It’s brightness varies with its horizontal position ► [bitmap-from-procedure [p → [color p.X p.X p.X]] ] ►

Comparing to iterated-group This is sort of like iterated-group You give it a procedure And a number of times to run it (well, two numbers) And it makes a picture ► [bitmap-from-procedure [p → [color p.X p.X p.X]] ] ►

Comparing to iterated-group Except: The procedure you pass in Returns a color, not a shape Takes a position as an input Takes two count parameters (one for width, one for height) ► [bitmap-from-procedure [p → [color p.X p.X p.X]] ] ►

Example 2 The procedure [p → [color p.X 0 p.Y]] Changes red and blue independently So hue varies over space ► [bitmap-from-procedure [p → [color p.X 0 p.Y]] ] ►

Example 3 ► [define sine-wave [n → [+ 128 [× 127 [sin [∕ n 20]]]]]] ► [bitmap-from-procedure [p → [color 0 [sine-wave p.X] [sine-wave p.Y]]] ]

Bitmap procedures [map-bitmap procedure bitmap] Makes a new bitmap of the same size as bitmap Calls procedure with each pixel of bitmap Procedure returns the color of the respective pixel for the new bitmap Returns the new bitmap

Comparing to iterated-group Iterated-group and bitmap-from-procedure construct pictures from scratch But computing each element (shape or pixel color) as specified by a procedure Map-bitmap constructs a new image from an old image By changing the color of each pixel As specified by a procedure

Extracting color components of an image ► [define cones [new Bitmap “c:/documents and settings/ian/my documents/cones.jpg”]] ►

Extracting color components of an image ► [define gray [i → [color i i i]]] ► [map-bitmap [c → [gray [red c]]] cones] ► ► [map-bitmap [c → [gray [green c]]] cones] ► Note: the gray procedure is already built in