Fundamentals of Python: From First Programs Through Data Structures

Slides:



Advertisements
Similar presentations
Digital Color 24-bit Color Indexed Color Image file compression
Advertisements

L.Ghadah R. Hadba CT1514-L1.  Computer Graphics :refers to processing of creating a new image from Geometry, Lighting parameters, Materials and Textures.Using.
Digital Imaging and Image Analysis
Color COM 366 Web Design & Production. RGB color Amount of light in each channel Closer to 255, whiter color gets Every color has value for red,
Multimedia for the Web: Creating Digital Excitement Multimedia Element -- Graphics.
Graphics CS 121 Concepts of Computing II. What is a graphic? n A rectangular image. n Stored in a file of its own, or … … embedded in another data file.
Computer Science 111 Fundamentals of Programming I Introduction to Digital Image Processing.
1 A Balanced Introduction to Computer Science, 2/E David Reed, Creighton University ©2008 Pearson Prentice Hall ISBN Chapter 12 Data.
Introduction to Computer Graphics
Part A Multimedia Production Rico Yu. Part A Multimedia Production Ch.1 Text Ch.2 Graphics Ch.3 Sound Ch.4 Animations Ch.5 Video.
Zinnia Bell. RAWimages are image files that have not yet processed, they contain minimally processed data from the image sensor of either a image scanner,
Graphics.
1 Bitmap Graphics It is represented by a dot pattern in which each dot is called a pixel. Each pixel can be in any one of the colors available and the.
Fundamentals of Python: First Programs
Faculty of Sciences and Social Sciences HOPE Website Development Graphics Stewart Blakeway FML 213
Dean Pentcheff NHMLAC MBPC/Crustacea 17 April 2006.
CSCI-235 Micro-Computers in Science Hardware Part II.
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.
TOPIC 4 INTRODUCTION TO MEDIA COMPUTATION: DIGITAL PICTURES Notes adapted from Introduction to Computing and Programming with Java: A Multimedia Approach.
Chapter 5 Using Classes and Objects in Media Computing
1 Perception, Illusion and VR HNRS 299, Spring 2008 Lecture 14 Introduction to Computer Graphics.
Photoshop Software Rasterized, file formats, and printing choices.
Addison Wesley is an imprint of © 2010 Pearson Addison-Wesley. All rights reserved. Chapter 5 Working with Images Starting Out with Games & Graphics in.
8 Using Web Graphics Section 8.1 Identify types of graphics Identify and compare graphic formats Describe compression schemes Section 8.2 Identify image.
Graphics and Animation Multimedia Projects Part 2.
1 Web Developer Foundations: Using XHTML Chapter 4 Key Concepts.
Computer Science 111 Fundamentals of Programming I Introduction to Graphics.
Digital Cameras And Digital Information. How a Camera works Light passes through the lens Shutter opens for an instant Film is exposed to light Film is.
Section 8.1 Create a custom theme Design a color scheme Use shared borders Section 8.2 Identify types of graphics Identify and compare graphic formats.
GRAPHICS. Topic Outline What is graphic. Resolution. Types of graphics. Using graphic in multimedia applications.
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.
Graphics workshop Library and Information Services University of St Andrews.
Image Representation. Digital Cameras Scanned Film & Photographs Digitized TV Signals Computer Graphics Radar & Sonar Medical Imaging Devices (X-Ray,
CSC1401. Learning Goals Understand at a conceptual level What is media computation? How does color vision work? How can you make colors with red, green,
Computer Science 111 Fundamentals of Programming I Introduction to Digital Image Processing.
2D Graphics Theory & Principles. Single Point Smallest addressable area on screen or digital image.
CHAPTER 8 Color and Texture Mapping © 2008 Cengage Learning EMEA.
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.
Adobe Photoshop CS5 – Illustrated Unit A: Getting Started with Photoshop CS5.
DIGITAL IMAGE. Basic Image Concepts An image is a spatial representation of an object An image can be thought of as a function with resulting values of.
Digital Imaging Fundamentals Ms. Hema C.R. School of Mechatronic Engineering.
CSCI-100 Introduction to Computing Hardware Part II.
Graphics Concepts Presentation
Introduction to Images & Graphics JMA260. Objectives Images introduction Photoshop.
Lesson 2: Introduction to Digital Imaging Digital Photography MITSAA IAP 2003 Rob Zehner.
TOPIC 4 INTRODUCTION TO MEDIA COMPUTATION: DIGITAL PICTURES Notes adapted from Introduction to Computing and Programming with Java: A Multimedia Approach.
Image Editing Vocabulary Words Pioneer Library System Norman Public Library Nancy Rimassa, Trainer Thanks to Wikipedia ( help.
Modul 2 Sifat Dasar Informasi Digital Mata Kuliah Preservasi Informasi Digital.
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.
Adobe Photoshop CS4 – Illustrated Unit A: Getting Started with Photoshop CS4.
1 Sections 5.1 – 5.2 Digital Image Processing Fundamentals of Java: AP Computer Science Essentials, 4th Edition Lambert / Osborne.
Graphics Basic Concepts 1.  A graphic is an image or visual representation of an object.  A visual representation such as a photo, illustration or diagram.
Understanding Images. Pixels pixels Every image is made up of very small squares called pixels, and each pixel represents a color or shade. Pixels within.
Chapter 14 Working with Graphics
BITMAPPED IMAGES & VECTOR DRAWN GRAPHICS
Section 8.1 Section 8.2 Create a custom theme Design a color scheme
DIGITAL MEDIA FOUNDATIONS
Fundamentals of Programming I Introduction to Graphics
Sampling, Quantization, Color Models & Indexed Color
Fundamentals of Programming I Introduction to Digital Image Processing
Fundamentals of Programming I Introduction to Graphics
Chapter III, Desktop Imaging Systems and Issues: Lesson IV Working With Images
Chapter 3:- Graphics Eyad Alshareef Eyad Alshareef.
Graphics Basic Concepts.
Representing Images 2.6 – Data Representation.
Digital Media Dr. Jim Rowan ITEC 2110.
Fundamentals of Programming I Introduction to Digital Image Processing
Presentation transcript:

Fundamentals of Python: From First Programs Through Data Structures Chapter 7 Simple Graphics and Image Processing

Objectives After completing this chapter, you will be able to: Use the concepts of object-based programming—classes, objects, and methods—to solve a problem Develop algorithms that use simple graphics operations to draw two-dimensional shapes Use the RGB system to create colors in graphics applications and modify pixels in images Fundamentals of Python: From First Programs Through Data Structures

Objectives (continued) Develop recursive algorithms to draw recursive shapes Write a nested loop to process a two-dimensional grid Develop algorithms to perform simple transformations of images, such as conversion of color to grayscale Fundamentals of Python: From First Programs Through Data Structures

Simple Graphics Graphics: Discipline that underlies the representation and display of geometric shapes in two- and three-dimensional space A Turtle graphics toolkit provides a simple and enjoyable way to draw pictures in a window turtlegraphics is a non-standard, open-source Python module Fundamentals of Python: From First Programs Through Data Structures

Overview of Turtle Graphics Turtle graphics originally developed as part of the children’s programming language Logo Created by Seymour Papert and his colleagues at MIT in the late 1960s Analogy: Turtle crawling on a piece of paper, with a pen tied to its tail Sheet of paper is a window on a display screen Position specified with (x, y) coordinates Cartesian coordinate system, with origin (0, 0) at the center of a window Fundamentals of Python: From First Programs Through Data Structures

Overview of Turtle Graphics (continued) Together, these attributes make up a turtle’s state Fundamentals of Python: From First Programs Through Data Structures

Turtle Operations Fundamentals of Python: From First Programs Through Data Structures

Turtle Operations (continued) Fundamentals of Python: From First Programs Through Data Structures

Turtle Operations (continued) Interface: set of methods of a given class Used to interact with an object Use docstring mechanism to view an interface help(<class name>) help(<class name>.<method name>) Fundamentals of Python: From First Programs Through Data Structures

Object Instantiation and the turtlegraphics Module Before you apply any methods to an object, you must create the object (i.e., an instance of) Instantiation: Process of creating an object Use a constructor to instantiate an object: To instantiate the Turtle class: Fundamentals of Python: From First Programs Through Data Structures

Object Instantiation and the turtlegraphics Module (continued) To close a window, you click its close box An attempt to manipulate a turtle whose window has been closed raises an error Fundamentals of Python: From First Programs Through Data Structures

Object Instantiation and the turtlegraphics Module (continued) Fundamentals of Python: From First Programs Through Data Structures

Drawing Two-Dimensional Shapes Many graphics applications use vector graphics, or the drawing of simple two-dimensional shapes, such as rectangles, triangles, and circles Fundamentals of Python: From First Programs Through Data Structures

Drawing Two-Dimensional Shapes (continued) Fundamentals of Python: From First Programs Through Data Structures

Taking a Random Walk Animals often appear to wander about randomly, but they are often searching for food, shelter, etc. Fundamentals of Python: From First Programs Through Data Structures

Taking a Random Walk (continued) Fundamentals of Python: From First Programs Through Data Structures

Colors and the RGB System Display area on a computer screen is made up of colored dots called picture elements or pixels Each pixel represents a color Among the various schemes for representing colors, the RGB system is a fairly common one Letters stand for red, green, and blue Each color component can range from 0 – 255 255  maximum saturation of a color component 0  total absence of that color component Called a true color system Fundamentals of Python: From First Programs Through Data Structures

Colors and the RGB System (continued) Each color component requires 8 bits; total number of bits needed to represent a color value is 24 Total number of RGB colors is 224 (16,777,216) Fundamentals of Python: From First Programs Through Data Structures

Example: Drawing with Random Colors The Turtle class includes a setColor method for changing the turtle’s drawing color Expects integers for the three RGB components Fundamentals of Python: From First Programs Through Data Structures

Example: Drawing with Random Colors (continued) The actual colors do not appear in book Fundamentals of Python: From First Programs Through Data Structures

Using the str Function with Objects str returns information about an object’s state print automatically calls the str function Fundamentals of Python: From First Programs Through Data Structures

Case Study: Recursive Patterns in Fractals Fractals are highly repetitive or recursive patterns A fractal object appears geometric, yet it cannot be described with ordinary Euclidean geometry Strangely, a fractal curve is not one-dimensional, and a fractal surface is not two-dimensional Every fractal shape has its own fractal dimension One example of a fractal curve is the c-curve Fundamentals of Python: From First Programs Through Data Structures

Case Study: Recursive Patterns in Fractals (continued) Fundamentals of Python: From First Programs Through Data Structures

Case Study: Recursive Patterns in Fractals (continued) Request: Write a program that allows the user to draw a particular c-curve in varying degrees Analysis: Program should prompt the user for the level of the c-curve Next, program should display a Turtle graphics window in which it draws the c-curve Fundamentals of Python: From First Programs Through Data Structures

Case Study: Recursive Patterns in Fractals (continued) Design: Fundamentals of Python: From First Programs Through Data Structures

Case Study: Recursive Patterns in Fractals (continued) Implementation (Coding): Fundamentals of Python: From First Programs Through Data Structures

Case Study: Recursive Patterns in Fractals (continued) Implementation (Coding) (continued): Fundamentals of Python: From First Programs Through Data Structures

Image Processing Digital image processing includes the principles and techniques for the following: The capture of images with devices such as flatbed scanners and digital cameras The representation and storage of images in efficient file formats Constructing the algorithms in image-manipulation programs such as Adobe Photoshop Fundamentals of Python: From First Programs Through Data Structures

Analog and Digital Information Computers must use digital information which consists of discrete values Example: Individual integers, characters of text, or bits The information contained in images, sound, and much of the rest of the physical world is analog Analog information contains a continuous range of values Ticks representing seconds on an analog clock’s face represent an attempt to sample moments of time as discrete values (time itself is analog) Fundamentals of Python: From First Programs Through Data Structures

Sampling and Digitizing Images A visual scene projects an infinite set of color and intensity values onto a two-dimensional sensing medium If you sample enough of these values, digital information can represent an image more or less indistinguishable (to human eye) from original scene Sampling devices measure discrete color values at distinct points on a two-dimensional grid These values are pixels As more pixels are sampled, the more realistic the resulting image will appear Fundamentals of Python: From First Programs Through Data Structures

Image File Formats Once an image has been sampled, it can be stored in one of many file formats A raw image file saves all of the sampled information Data can be compressed to minimize its file size JPEG (Joint Photographic Experts Group) Uses lossless compression and a lossy scheme GIF (Graphic Interchange Format) Uses a lossy compression and a color palette of up to 256 of the most prevalent colors in the image Fundamentals of Python: From First Programs Through Data Structures

Image-Manipulation Operations Image-manipulation programs either transform the information in the pixels or alter the arrangement of the pixels in the image Examples: Rotate an image Convert an image from color to grayscale Blur all or part of an image Sharpen all or part of an image Control the brightness of an image Perform edge detection on an image Enlarge or reduce an image’s size Fundamentals of Python: From First Programs Through Data Structures

The Properties of Images The coordinates of pixels in the two-dimensional grid of an image range from (0, 0) at the upper-left corner to (width-1, height-1) at lower-right corner width/height are the image’s dimensions in pixels Thus, the screen coordinate system for the display of an image is different from the standard Cartesian coordinate system that we used with Turtle graphics The RGB color system is a common way of representing the colors in images Fundamentals of Python: From First Programs Through Data Structures

The images Module Non-standard, open-source Python tool Image class represents an image as a two-dimensional grid of RGB values Fundamentals of Python: From First Programs Through Data Structures

The images Module (continued) Fundamentals of Python: From First Programs Through Data Structures

A Loop Pattern for Traversing a Grid Most of the loops we have used in this book have had a linear loop structure Many image-processing algorithms use a nested loop structure to traverse a two-dimensional grid of pixels Fundamentals of Python: From First Programs Through Data Structures

A Loop Pattern for Traversing a Grid (continued) Previous loop uses a row-major traversal We use this template to develop many of the algorithms that follow: Fundamentals of Python: From First Programs Through Data Structures

A Word on Tuples A pixel’s RGB values are stored in a tuple: Fundamentals of Python: From First Programs Through Data Structures

Converting an Image to Black and White For each pixel, compute average of R/G/B values Then, reset pixel’s color values to 0 (black) if the average is closer to 0, or to 255 (white) if the average is closer to 255 Fundamentals of Python: From First Programs Through Data Structures

Converting an Image to Black and White (continued) Fundamentals of Python: From First Programs Through Data Structures

Converting an Image to Grayscale Black and white photographs contain various shades of gray known as grayscale Grayscale can be an economical scheme (the only color values might be 8, 16, or 256 shades of gray) A simple method: Problem: Does not reflect manner in which different color components affect human perception Scheme needs to take differences in luminance into account Fundamentals of Python: From First Programs Through Data Structures

Converting an Image to Grayscale (continued) Fundamentals of Python: From First Programs Through Data Structures

Copying an Image The method clone builds and returns a new image with the same attributes as the original one, but with an empty string as the filename Fundamentals of Python: From First Programs Through Data Structures

Blurring an Image Pixilation can be mitigated by blurring Fundamentals of Python: From First Programs Through Data Structures

Edge Detection Edge detection removes the full colors to uncover the outlines of the objects represented in the image Fundamentals of Python: From First Programs Through Data Structures

Reducing the Image Size The size and the quality of an image on a display medium depend on two factors: Image’s width and height in pixels Display medium’s resolution Measured in pixels, or dots per inch (DPI) The resolution of an image can be set before the image is captured A higher DPI causes sampling device to take more samples (pixels) through the two-dimensional grid A size reduction usually preserves an image’s aspect ratio Fundamentals of Python: From First Programs Through Data Structures

Reducing the Image Size (continued) Reducing size throws away some pixel information Fundamentals of Python: From First Programs Through Data Structures

Summary Object-based programming uses classes, objects, and methods to solve problems A class specifies a set of attributes and methods for the objects of that class The values of the attributes of a given object make up its state A new object is obtained by instantiating its class The behavior of an object depends on its current state and on the methods that manipulate this state The set of a class’s methods is called its interface Fundamentals of Python: From First Programs Through Data Structures

Summary (continued) A class usually includes an __str__ method that returns a string representation of an instance Turtle graphics is a lightweight toolkit used to draw pictures in a Cartesian coordinate system RGB system represents a color value by mixing integer components that represent red, green, and blue intensities A grayscale system uses 8, 16, or 256 distinct shades of gray Fundamentals of Python: From First Programs Through Data Structures

Summary (continued) Digital images are captured by sampling analog information from a light source, using a device such as a digital camera or a flatbed scanner Can be stored in several formats, like JPEG and GIF When displaying an image file, each color value is mapped onto a pixel in a two-dimensional grid A nested loop structure is used to visit each position Image-manipulation algorithms either transform pixels at given positions or create a new image using the pixel information of a source image Fundamentals of Python: From First Programs Through Data Structures