热线电话:13121318867

登录
首页大数据时代基于OpenCV的图像卡通化
基于OpenCV的图像卡通化
2020-08-11
收藏


文章来源: 小白学视觉

作者:努比

本期将创建一个类似于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的功能。


数据分析咨询请扫描二维码

最新资讯
更多
客服在线
立即咨询