Unit 2.2 Data Compression, Images
- Notes
- Questions
- Additionally, review all the imports in these three demos. Create a definition of their purpose, specifically these ...
- Hacks
Notes
- Lossy data can reduce data, but the original data cannot be recovered, but lossless data can, data compression is used to save space and transmission time.
- The file types are gif, png, jpg, etc.
- The work deployment in the terminal of windows and mac and wsl is different
- Python Image Library (PIL) enables images to be worked with in python
- Base64 can transfer image formats (jpg, png) into text assets such as html, css, etc.
- Buffering is used to optimize input/output operations
- numpy can simplify accessing and changing RGB values of pixels
- Object oriented programming (OOP), which is required for most data structure classes.
Questions
pathlib
File paths are different on Windows versus Mac and Linux. This can cause problems in a project as you work and deploy on different Operating Systems (OS's), pathlib is a solution to this problem.
- What are commands you use in terminal to access files?
Type cd and press Return to change directory to access files Type Is and press Return to list all files in the current directory. The pwd command tells you what directory you are currently in, etc.
- What are the command you use in Windows terminal to access files?
search in c drive
- What are some of the major differences?
the path when accessing files. wsl is not searching in the c drive
Provide what you observed, struggled with, or leaned while playing with this code.
- Why is path a big deal when working with images?
The path determines where you will process the image, otherwise you will not find the file.
- How does the meta data source and label relate to Unit 5 topics?
Metadata is data that provides information about other data, not the content of the data, that is, the sass, theme, etc. mentioned in the fifth unit
- Look up IPython, describe why this is interesting in Jupyter Notebooks for both Pandas and Images?
ipython is a command shell for interactive computing in many programming languages. Jupyter's architecture includes a front end (web or console) and a back end (kernels for various languages). The IPython console is all about Python and the terminal. pandas is an ipython library for working with datasets.
from IPython.display import Image, display
from pathlib import Path # https://medium.com/@ageitgey/python-3-quick-tip-the-easy-way-to-deal-with-file-paths-on-windows-mac-and-linux-11a072b58d5f
# prepares a series of images
def image_data(path=Path("images/"), images=None): # path of static images is defaulted
if images is None: # default image
images = [
{'source': "Peter Carolin", 'label': "Clouds Impression", 'file': "clouds-impression.png"},
{'source': "Peter Carolin", 'label': "Lassen Volcano", 'file': "lassen-volcano.jpg"}
]
for image in images:
# File to open
image['filename'] = path / image['file'] # file with path
return images
# define the format of how to disply images
def image_display(images):
for image in images:
display(Image(filename=image['filename']))
# Run this as standalone tester to see sample data printed in Jupyter terminal
if __name__ == "__main__":
# print parameter supplied image
green_square = image_data(images=[{'source': "Internet", 'label': "Green Square", 'file': "green-square-16.png"}])
image_display(green_square)
happy_face = image_data(images=[{'source': "Internet", 'label': "Happy Face", 'file': "download(1).jpg"}])
image_display(happy_face)
# display default images from image_data()
default_images = image_data()
image_display(default_images)
base64
Image formats (JPG, PNG) are often called *Binary File formats, it is difficult to pass these over HTTP. Thus, base64 converts binary encoded data (8-bit, ASCII/Unicode) into a text encoded scheme (24 bits, 6-bit Base64 digits). Thus base64 is used to transport and embed binary images into textual assets such as HTML and CSS.- How is Base64 similar or different to Binary and Hexadecimal?
Similarity: Binary is base2, hexadecimal is base 16 Difference:how bytes represented
- Translate first 3 letters of your name to Base64.
WmV1
io, BytesIO
Input and Output (I/O) is a fundamental of all Computer Programming. Input/output (I/O) buffering is a technique used to optimize I/O operations. In large quantities of data, how many frames of input the server currently has queued is the buffer. In this example, there is a very large picture that lags.
- Where have you been a consumer of buffering?
Video loading page when watching youtube or watching TV
- From your consumer experience, what effects have you experienced from buffering?
Buffering makes me gradually lose patience, but it also temporarily distracts me from electronics.
- How do these effects apply to images?
In the buffer, the program will use some memory to process the image.
Data Structures, Imperative Programming Style, and working with Images
Introduction to creating meta data and manipulating images. Look at each procedure and explain the the purpose and results of this program. Add any insights or challenges as you explored this program.
- Does this code seem like a series of steps are being performed?
It seems yes.
- Describe Grey Scale algorithm in English or Pseudo code?
Get the red, green and blue values of a pixel, convert these values to a single gray value, and replace the original red, green and blue values with the new gray values.
- Describe scale image? What is before and after on pixels in three images?
Scale image refers to resizing the percentage of the width and height of a digital image.
- Is scale image a type of compression? If so, line it up with College Board terms described?
Scale image is to make the two-dimensional aspect of the image larger and smaller, but compression is to make the capacity of the image smaller while retaining most of the main information.
from IPython.display import HTML, display
from pathlib import Path # https://medium.com/@ageitgey/python-3-quick-tip-the-easy-way-to-deal-with-file-paths-on-windows-mac-and-linux-11a072b58d5f
from PIL import Image as pilImage # as pilImage is used to avoid conflicts
# To optimize I/O operations
from io import BytesIO
# converting immages into textual assets
import base64
# To simplify access and change to the RGB values of the pixels ad coverting pixels to grey scale
import numpy as np
# prepares a series of images
def image_data(path=Path("images/"), images=None): # path of static images is defaulted
if images is None: # default image
images = [
{'source': "Internet", 'label': "Green Square", 'file': "green-square-16.png"},
{'source': "Peter Carolin", 'label': "Clouds Impression", 'file': "clouds-impression.png"},
{'source': "Peter Carolin", 'label': "Lassen Volcano", 'file': "lassen-volcano.jpg"},
{'source': "Internet", 'label': "Happy Face", 'file': "download(1).jpg"}
]
for image in images:
# File to open
image['filename'] = path / image['file'] # file with path
return images
# Large image scaled to baseWidth of 320
def scale_image(img):
baseWidth = 320
scalePercent = (baseWidth/float(img.size[0]))
scaleHeight = int((float(img.size[1])*float(scalePercent)))
scale = (baseWidth, scaleHeight)
return img.resize(scale)
# PIL image converted to base64
def image_to_base64(img, format):
with BytesIO() as buffer:
img.save(buffer, format)
return base64.b64encode(buffer.getvalue()).decode()
# Set Properties of Image, Scale, and convert to Base64
def image_management(image): # path of static images is defaulted
# Image open return PIL image object
img = pilImage.open(image['filename'])
# Python Image Library operations
image['format'] = img.format
image['mode'] = img.mode
image['size'] = img.size
# Scale the Image
img = scale_image(img)
image['pil'] = img
image['scaled_size'] = img.size
# Scaled HTML
image['html'] = '<img src="data:image/png;base64,%s">' % image_to_base64(image['pil'], image['format'])
# Create Grey Scale Base64 representation of Image
def image_management_add_html_grey(image):
# Image open return PIL image object
img = image['pil']
format = image['format']
img_data = img.getdata() # Reference https://www.geeksforgeeks.org/python-pil-image-getdata/
image['data'] = np.array(img_data) # PIL image to numpy array
image['gray_data'] = [] # key/value for data converted to gray scale
# 'data' is a list of RGB data, the list is traversed and hex and binary lists are calculated and formatted
for pixel in image['data']:
# create gray scale of image, ref: https://www.geeksforgeeks.org/convert-a-numpy-array-to-an-image/
average = (pixel[0] + pixel[1] + pixel[2]) // 3 # average pixel values and use // for integer division
if len(pixel) > 3:
image['gray_data'].append((average, average, average, pixel[3])) # PNG format
else:
image['gray_data'].append((average, average, average))
# end for loop for pixels
img.putdata(image['gray_data'])
image['html_grey'] = '<img src="data:image/png;base64,%s">' % image_to_base64(img, format)
# Jupyter Notebook Visualization of Images
if __name__ == "__main__":
# Use numpy to concatenate two arrays
images = image_data()
# Display meta data, scaled view, and grey scale for each image
for image in images:
image_management(image)
print("---- meta data -----")
print(image['label'])
print(image['source'])
print(image['format'])
print(image['mode'])
print("Original size: ", image['size'])
print("Scaled size: ", image['scaled_size'])
print("-- original image --")
display(HTML(image['html']))
print("--- grey image ----")
image_management_add_html_grey(image)
display(HTML(image['html_grey']))
print()
Additionally, review all the imports in these three demos. Create a definition of their purpose, specifically these ...
- PIL is an additional library for the python language that adds support for many image file formats
- numpy is a library for the python programming language with a large number of advanced mathematical functions for manipulating arrays
- base64 can encode small images into text encoding scheme
Hacks
Early Seed award
- Add this Blog to you own Blogging site.
- In the Blog add a Happy Face image.
- Have Happy Face Image open when Tech Talk starts, running on localhost. Don't tell anyone. Show to Teacher.
AP Prep
- In the Blog add notes and observations on each code cell that request an answer.
- In blog add College Board practice problems for 2.2
- Choose 2 images, one that will more likely result in lossy data compression and one that is more likely to result in lossless data compression. Explain.
I chose jpeg image files as more likely to result in lossy data compression, because then the creator can decide how much loss to introduce, in terms of file size and image quality,and I chose the png image file as the one that would result in more lossless compression, since it compresses and shrinks the image without any loss of quality.
Project Addition
- If your project has images in it, try to implement an image change that has a purpose. (Ex. An item that has been sold out could become gray scale)
Pick a programming paradigm and solve some of the following ...
- Numpy, manipulating pixels. As opposed to Grey Scale treatment, pick a couple of other types like red scale, green scale, or blue scale. We want you to be manipulating pixels in the image.
After importing numpy, convert image data from PIL to numpy array when defining image management, then convert image data to red scale, create red scale of image and average pixel values, and then use this function to display when printing
- Binary and Hexadecimal reports. Convert and produce pixels in binary and Hexadecimal and display.
After the image is read, it is converted to grayscale and a threshold flag is set stating how many bits per pixel and the resolution in pixels Sorry, I'm not sure how to do this.
- Compression and Sizing of images. Look for insights into compression Lossy and Lossless. Look at PIL library and see if there are other things that can be done.
- There are many effects you can do as well with PIL. Blur the image or write Meta Data on screen, aka Title, Author and Image size.