文章来源: 小白学视觉
作者:努比
本期将创建一个类似于Adobe Lightroom的Web应用程序,使用OpenCV和Streamlit实现图像的卡通化
作为一个狂热的街头摄影爱好者,几乎每个周末都要在城市中拍摄一些照片,因此Adobe Lightroom始终是我们的首选软件,通过它可以编辑原始照片以使其更具“ Instagram风格”。
我们想能否创建一个自己的图像编辑软件?
开源计算机视觉库(如OpenCV)和开源应用程序框架(如Streamlit)的出现使这一想法得以实现。使用不到100行代码,我们就可以构建一个简单的图像卡通化Web应用程序,模仿Adobe Lightroom的功能。
在本文中,我们将展示如何使用OpenCV和Streamlit,根据滤波器,构建一个简单的Web应用程序,以将图像转换为卡通图像。
如何使图像成为卡通图?
我们通常需要执行两个主要步骤将图像转换为卡通图像:边缘检测和区域平滑。
边缘检测的主要目的显然是为了强调图像的边缘,因为卡通图像通常具有良好的边缘。同时,区域平滑的主要目的是消除颜色边界并减少图像的噪点,使图像像素化程度降低。
根据不同滤波器,我们可以获得不同的图像卡通化结果。在本文中,将有四个不同的过滤器:
1. 铅笔素描
2. 细节增强
3. 双边过滤器
4. 铅笔边缘
接下来,我们将展示如何应用每个过滤器,以及从每个过滤器中获得什么样的结果。
铅笔素描滤波器
使用“铅笔素描”滤波器,您的图像将被转换为素描,就像使用铅笔绘制图像一样。下面是使用OpenCV将图像转换为铅笔素描的完整代码。
# Convert the image into grayscale image gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY) # Blur the image using Gaussian Blur gray_blur = cv2.GaussianBlur(gray, (25, 25), 0) # Convert the image into pencil sketch cartoon = cv2.divide(gray, gray_blur, scale=250.0)
令人惊讶的是,使用OpenCV,我们只需三行代码就可以将图像转换成铅笔素描状的图片。现在让我逐行解释一下该图像发生了哪些变化。
在第一行中,我们使用OpenCV的cvtColor()功能将图像从彩色通道转换为灰度通道。这很简单,处理的结果是我们将图像变成了灰度图。
接下来,我们使用高斯模糊对图像进行模糊处理。模糊灰度图像,实际上是在平滑图像,减少图像的噪点。另外,模糊也是我们检测图像边缘的必要步骤。
模糊图像,可以使用OpenCV中的GaussianBlur()功能。我在GaussianBlur()函数中输入的(25,25)是内核的大小。
由于我们使用高斯模糊,因此内核中像素值的分布遵循正态分布。核数越大,标准偏差将越大,因此模糊效果越强。下面是内核大小不同时的模糊结果示例。
基于不同内核大小的模糊效果
最后一步是将原始灰度图像除以模糊后的灰度图像。这样可以得出两个图像中每个像素之间的变化率。模糊效果越强,每个像素的值相对于其原点的变化就越大,因此,它使我们的铅笔素描更加清晰。
以下是使用铅笔素描过滤器的结果。
铅笔素描过滤器实现示例
细节增强滤波器
简而言之,“细节增强”滤镜通过锐化图像,平滑颜色以及增强边缘效果为我们提供了卡通效果。以下是使用此滤镜将您的图像转换成卡通的完整代码。
#convert the image into grayscale image gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY) #Blur the grayscale image with median blur gray_blur = cv2.medianBlur(gray, 3) #Apply adaptive thresholding to detect edges edges = cv2.adaptiveThreshold(gray_blur, 255, cv2.ADAPTIVE_THRESH_MEAN_C, cv2.THRESH_BINARY, 9, 9) #Sharpen the image color = cv2.detailEnhance(img, sigma_s=5, sigma_r=0.5) #Merge the colors of same images using "edges" as a mask cartoon = cv2.bitwise_and(color, color, mask=edges)
第一步与之前相同,我们需要将图像转换为灰度图像。
接下来,不使用高斯模糊,而是应用中值模糊。为此,我们使用OpenCV中的medianBlur() 函数。中值模糊通过计算与内核重叠的像素值的中值,然后将其中心像素替换为中值。但是,我们可以根据需要先使用高斯模糊。
接下来,我们需要检测图像的边缘。为此,将自适应阈值与OpenCV中的adaptiveThreshold() 函数一起应用。自适应阈值的主要目标是根据内核重叠的像素的平均值,将图像每个区域中的每个像素值转换为黑色或白色。
以下是自适应阈值对模糊图像的影响的可视化结果。
左:自适应阈值之前—右:自适应阈值之后
为了使图像看起来更清晰,我们可以使用OpenCV中的detailEnhance()函数。我们需要指定两个参数:
• sigma_s:控制着邻域的大小,该邻域的大小将被加权以替换图像中的像素值。值越高,邻域越大。这样可以使图像更平滑。
• sigma_r:如果要在平滑图像时保留边缘,这很重要。较小的值只会产生非常相似的颜色进行平均(即平滑),而相差很大的颜色将保持不变。
最后,我们使用自适应阈值的结果作为掩码。然后,根据蒙版的值合并细节增强的结果,以创建具有清晰边缘的清晰效果。
以下是“细节增强”过滤器的示例结果。
细节增强过滤器实现示例
双边过滤器
使用双边滤镜的一大优势是,我们可以在保留边缘的同时使图像和颜色平滑。以下是通过双边过滤将您的图像转换为卡通图像的完整代码。
#convert the image into grayscale image gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY) #Blur the grayscale image with median blur gray_blur = cv2.medianBlur(gray, 3) #Apply adaptive thresholding to detect edges edges = cv2.adaptiveThreshold(gray_blur, 255, cv2.ADAPTIVE_THRESH_MEAN_C, cv2.THRESH_BINARY, 9, 9) #Sharpen the image color = cv2.detailEnhance(img, sigma_s=5, sigma_r=0.5) #Merge the colors of same images using "edges" as a mask cartoon = cv2.bitwise_and(color, color, mask=edges)
如果仔细看,所有步骤都与“细节增强”过滤器中的步骤相似,但是这次不是使用detailEnhance() 函数,而是使用openCV中的bilateralFilter()函数。
调用此函数时需要传递的参数与detailEnhance()相同,只多一个附加参数,即内核大小d。首先,我们指定图像源,然后是d,sigma_s和sigma_r值控制平滑效果,并保持边缘。
以下是使用双边过滤器的结果示例。
双边过滤器实施示例
铅笔边缘滤波器
铅笔边缘滤镜可创建仅包含重要边缘和白色背景的新图像。要应用此滤波器,下面是完整的代码。
#Convert the image into grayscale image gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY) #Blur the grayscale image using median blur gray = cv2.medianBlur(gray, 25) #Detect edges with Laplacian edges = cv2.Laplacian(gray, -1, ksize=3) #Invert the edges edges_inv = 255-edges #Create a pencil edge sketch dummy, cartoon = cv2.threshold(edges_inv, 150, 255, cv2.THRESH_BINARY)
前两个步骤与其他过滤器相同。首先,我们将图像转换为灰度图像。接下来,我们使用大小为25的内核对图像进行模糊处理。
接下来,我们应用拉普拉斯滤波器来检测边缘。根据内核的大小,拉普拉斯滤波器中的值可以不同。
Laplacian滤波器的工作是,将通过对象内部的灰度级和图像背景强度来突出对象的边缘。以下是拉普拉斯滤波器应用结果。
左:拉普拉斯滤波器应用之前—右:拉普拉斯滤波器应用之后
接下来,我们将Laplacian滤波器的结果求反。最后,通过应用openCV中的threshold()函数,根据指定的阈值将灰度图像转换为全黑或全白。
以下是“铅笔边缘”过滤器的结果示例。
Pencil Edges滤镜实现示例
使用Streamlit构建图像卡通化Web应用程序
在创建了图像卡通化滤波器的代码之后,现在就可以创建图像卡通化Web应用程序了。
第一步,需要将创建图像卡通化滤波器的所有代码放入一个函数中,以便于访问。到目前为止,我们已经对每个参数值进行了硬编码,例如内核的大小等等。
现在,我们可以让用户使用滑块根据自己的喜好指定一个值,而不是对每个参数值进行硬编码。为此,我们可以使用Streamlit中的streamlit.slider()函数。下面是其实现的示例。
gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY) scale_val = st.slider('Tune the brightness of your sketch (the higher the value, the brighter your sketch)', 0.0, 300.0, 250.0) kernel = st.slider('Tune the boldness of the edges of your sketch (the higher the value, the bolder the edges)', 1, 99, 25, step=2) gray_blur = cv2.GaussianBlur(gray, (kernel, kernel), 0) cartoon = cv2.divide(gray, gray_blur, scale= scale_val)
使用此滑块,可以创建一个交互式图像卡通化Web应用程序,就像Adobe Lightroom一样。每次调整内核的值和其他参数时,图像卡通化的结果都会实时更改和更新。
我们可以将其应用到streamlit.slider()上,创建的每个图像卡通化滤波器,以替换硬编码的参数值。
接下来,我们需要添加一个小插件,以便用户可以上传自己想要转换为卡通的图像。为此,我们可以使用Streamlit中的streamlit.file_uploader()函数。要添加某些文本到Web应用程序中,我们可以使用Streamlit 中的streamlit.text()或streamlit.write()。
用户上传图像后,现在我们需要显示图像,使用图像卡通化滤波器之一编辑图像,并显示卡通化图像,以便用户知道他们是否要进一步调整滑块。要显示图像,我们可以使用Streamlit中的streamlit.image()函数。
以下是在不到100行代码的情况下如何构建图像卡通化Web应用程序的实现。
import cv2 import streamlit as st import numpy as np from PIL import Image def cartoonization (img, cartoon): gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY) if cartoon == "Pencil Sketch": value = st.sidebar.slider('Tune the brightness of your sketch (the higher the value, the brighter your sketch)', 0.0, 300.0, 250.0) kernel = st.sidebar.slider('Tune the boldness of the edges of your sketch (the higher the value, the bolder the edges)', 1, 99, 25, step=2) gray_blur = cv2.GaussianBlur(gray, (kernel, kernel), 0) cartoon = cv2.divide(gray, gray_blur, scale=value) if cartoon == "Detail Enhancement": smooth = st.sidebar.slider('Tune the smoothness level of the image (the higher the value, the smoother the image)', 3, 99, 5, step=2) kernel = st.sidebar.slider('Tune the sharpness of the image (the lower the value, the sharper it is)', 1, 21, 3, step =2) edge_preserve = st.sidebar.slider('Tune the color averaging effects (low: only similar colors will be smoothed, high: dissimilar color will be smoothed)', 0.0, 1.0, 0.5) gray = cv2.medianBlur(gray, kernel) edges = cv2.adaptiveThreshold(gray, 255, cv2.ADAPTIVE_THRESH_MEAN_C, cv2.THRESH_BINARY, 9, 9) color = cv2.detailEnhance(img, sigma_s=smooth, sigma_r=edge_preserve) cartoon = cv2.bitwise_and(color, color, mask=edges) if cartoon == "Pencil Edges": kernel = st.sidebar.slider('Tune the sharpness of the sketch (the lower the value, the sharper it is)', 1, 99, 25, step=2) laplacian_filter = st.sidebar.slider('Tune the edge detection power (the higher the value, the more powerful it is)', 3, 9, 3, step =2) noise_reduction = st.sidebar.slider('Tune the noise effects of your sketch (the higher the value, the noisier it is)', 10, 255, 150) gray = cv2.medianBlur(gray, kernel) edges = cv2.Laplacian(gray, -1, ksize=laplacian_filter) edges_inv = 255-edges dummy, cartoon = cv2.threshold(edges_inv, noise_reduction, 255, cv2.THRESH_BINARY) if cartoon == "Bilateral Filter": smooth = st.sidebar.slider('Tune the smoothness level of the image (the higher the value, the smoother the image)', 3, 99, 5, step=2) kernel = st.sidebar.slider('Tune the sharpness of the image (the lower the value, the sharper it is)', 1, 21, 3, step =2) edge_preserve = st.sidebar.slider('Tune the color averaging effects (low: only similar colors will be smoothed, high: dissimilar color will be smoothed)', 1, 100, 50) gray = cv2.medianBlur(gray, kernel) edges = cv2.adaptiveThreshold(gray, 255, cv2.ADAPTIVE_THRESH_MEAN_C, cv2.THRESH_BINARY, 9, 9) color = cv2.bilateralFilter(img, smooth, edge_preserve, smooth) cartoon = cv2.bitwise_and(color, color, mask=edges) return cartoon ############################################################################### st.write(""" # Cartoonize Your Image! """ ) st.write("This is an app to turn your photos into cartoon") file = st.sidebar.file_uploader("Please upload an image file", type=["jpg", "png"]) if file is None: st.text("You haven't uploaded an image file") else: image = Image.open(file) img = np.array(image) option = st.sidebar.selectbox( 'Which cartoon filters would you like to apply?', ('Pencil Sketch', 'Detail Enhancement', 'Pencil Edges', 'Bilateral Filter')) st.text("Your original image") st.image(image, use_column_width=True) st.text("Your cartoonized image") cartoon = cartoonization(img, option) st.image(cartoon, use_column_width=True)
现在,可以打开提示符,然后转到包含上面代码的Python文件的工作目录。接下来,您需要使用以下命令运行代码。
streamlit run your_app_name.py
最后,您可以在本地计算机上使用图像卡通化Web应用程序!以下是该网络应用程序的示例。
该网络应用程序示例
部署Web应用
本节是可选的,但是如果小伙伴需要部署Web应用程序以便其他人也可以访问您的Web应用程序,则可以使用Heroku部署Web应用程序。
要将Web应用程序部署到Heroku,首先要免费创建一个Heroku帐户,然后下载Heroku CLI。
接下来需要在与Python文件相同的目录中创建四个其他文件,它们是:
• requirements.txt:这是文本文件,用于告诉Heroku构建Web应用程序需要哪些依赖项。因为在我们的web应用程序,我们使用四种不同的库:opencv,numpy,Pillow,和streamlit,那么我们就可以写所有这些库及其版本为requirements.txt的
opencv-python==4.3.0.36 streamlit==0.63.0 Pillow==7.0.0 numpy==1.18.1
• setup.sh:这是用于在Heroku上设置配置的文件。为此setup.sh文件编写以下内容。
mkdir -p ~/.streamlit/ echo "\ [server]\n\ headless = true\n\ port = $PORT\n\ enableCORS = false\n\ \n\ " > ~/.streamlit/config.toml
• Procfile:这是告诉Heroku哪些文件以及应如何执行文件的文件。为Procfile编写以下内容。
web: sh setup.sh && streamlit run cartoon_app.py
• Aptfile:这是Heroku 构建包的文件,以使OpenCV能够在Heroku中运行。为Aptfile编写以下内容。
libsm6 libxrender1 libfontconfig1 libice6
接下来,打开命令提示符,然后转到Python文件和这四个其他文件的工作目录。在其中键入heroku login命令,以便您登录到Heroku帐户。
现在,您可以通过键入来创建新应用heroku create your-app-name。为确保您位于新创建的应用程序内部,请键入以下内容:
heroku git:remote -a your-app-name
接下来,我们需要在新创建的应用程序中添加一个buildpack,以使OpenCV能够在Heroku上运行。要添加必要的buildpack,请在Heroku CLI上键入以下内容。
heroku create --buildpack https://github.com/heroku/heroku-buildpack-apt.git
现在设置好了。接下来,您需要通过打字来初始化一个空的git git init其次是git add .,git commit和git push heroku master命令。
git init git add . git commit -m "Add your messages" git push heroku master
之后,部署过程就开始了,并且可能需要一些时间来等待此部署过程。最后,Heroku将生成新部署的Web应用程序的URL。
就是这样!现在,我们已经构建了自己的图像卡通化Web应用程序,该应用程序模仿了Adobe Lightroom的功能。
数据分析咨询请扫描二维码
CDA数据分析师认证:CDA认证分为三个等级:Level Ⅰ、Level Ⅱ和Level Ⅲ,每个等级的报考条件如下: Le ...
2024-11-14自学数据分析可能是一条充满挑战却又令人兴奋的道路。随着数据在现代社会中的重要性日益增长,掌握数据分析技能不仅能提升你的就 ...
2024-11-14数据分析相关职业选择 数据分析领域正在蓬勃发展,为各种专业背景的人才提供了丰富的职业机会。从初学者到有经验的专家,每个人 ...
2024-11-14数据挖掘与分析在金融行业的使用 在当今快速发展的金融行业中,数据挖掘与分析的应用愈发重要,成为驱动行业变革和提升竞争力的 ...
2024-11-14学习数据挖掘需要掌握哪些技能 数据挖掘是一个不断发展的领域,它结合了统计学、计算机科学和领域专业知识,旨在从数据中提取有 ...
2024-11-14统计学作为一门基于数据的学科,其广泛的应用领域和多样的职业选择,使得毕业生拥有丰厚的就业前景。无论是在政府还是企业,统计 ...
2024-11-14在当今高速发展的技术环境下,企业正在面临前所未有的机遇和挑战。数字化转型已成为企业保持竞争力和应对市场变化的必由之路。要 ...
2024-11-13爬虫技术在数据分析中扮演着至关重要的角色,其主要作用体现在以下几个方面: 数据收集:爬虫能够自动化地从互联网上抓取大量数 ...
2024-11-13在数据分析中,数据可视化是一种将复杂数据转化为图表、图形或其他可视形式的技术,旨在通过直观的方式帮助人们理解数据的含义与 ...
2024-11-13在现代银行业中,数字化用户行为分析已成为优化产品和服务、提升客户体验和提高业务效率的重要工具。通过全面的数据采集、深入的 ...
2024-11-13在这个数据飞速增长的时代,企业若想在竞争中占据优势,必须充分利用数据分析优化其营销策略。数据不仅有助于理解市场趋势,还可 ...
2024-11-13数据分析行业的就业趋势显示出多个积极的发展方向。随着大数据和人工智能技术的不断进步,数据分析在各行各业中的应用变得越来越 ...
2024-11-13市场数据分析是一门涉及多种技能和工具的学科,对企业在竞争激烈的市场中保持竞争力至关重要。通过数据分析,企业不仅可以了解当 ...
2024-11-13数据分析与数据挖掘是数据科学领域中两个关键的组成部分,它们各有独特的目标、方法和应用场景。尽管它们经常在实际应用中结合使 ...
2024-11-13在如今这个数据驱动的时代,数据分析能力已经成为许多行业的重要技能。无论是为工作需要,还是为了职业转型,掌握数据分析都能够 ...
2024-11-13在如今这个数据驱动的时代,数据分析能力已经成为许多行业的重要技能。无论是为工作需要,还是为了职业转型,掌握数据分析都能够 ...
2024-11-13作为一名业务分析师,你肩负着将业务需求转化为技术解决方案的重任。面试这一角色时,涉及的问题多种多样,涵盖技术技能、分析能 ...
2024-11-13自学数据分析可能看似一项艰巨的任务,尤其在开始时。但是,通过一些策略和方法,你可以系统地学习和掌握数据分析的相关知识和技 ...
2024-11-10Excel是数据分析领域中的一款强大工具,它凭借其灵活的功能和易用的界面,成为了许多数据分析师和从业者的首选。无论是简单的数 ...
2024-11-10在快速发展的商业环境中,数据分析能力已经成为许多行业的核心竞争力。无论是初学者还是经验丰富的专家,搭建一个有效的数据分析 ...
2024-11-10