使用 Python 和 OpenCV 實現邊緣檢測：逐步指南-Python教學-PHP中文網

首頁

後端開發

Python教學

使用 Python 和 OpenCV 實現邊緣檢測：逐步指南

DDD

Oct 20, 2024 am 06:10 AM

介紹

邊緣偵測是電腦視覺的基礎，使我們能夠辨識影像中的物件邊界。在本教程中，我們將使用 Sobel 算子和 Canny 邊緣偵測器以及 Python 和 OpenCV 來實作邊緣偵測。然後，我們將使用 Flask 創建一個簡單的 Web 應用程序，並使用 Bootstrap 進行樣式設計，以允許用戶上傳圖像並查看結果。

示範連結：邊緣偵測示範

先決條件

您的電腦上已安裝 Python 3.x。
Python 程式設計基礎。
熟悉 HTML 和 CSS 會有所幫助，但不是必要的。

設定環境

1.安裝所需的庫

開啟終端機或命令提示字元並執行：

pip install opencv-python numpy Flask

登入後複製

2.建立專案目錄

mkdir edge_detection_app
cd edge_detection_app

登入後複製

實施邊緣偵測

1. 索貝爾算子

Sobel 算子計算影像強度的梯度，強調邊緣。

程式碼實作：

import cv2

# Load the image in grayscale
image = cv2.imread('input_image.jpg', cv2.IMREAD_GRAYSCALE)
if image is None:
    print("Error loading image")
    exit()

# Apply Sobel operator
sobelx = cv2.Sobel(image, cv2.CV_64F, 1, 0, ksize=5)  # Horizontal edges
sobely = cv2.Sobel(image, cv2.CV_64F, 0, 1, ksize=5)  # Vertical edges

登入後複製

2. Canny 邊緣偵測器

Canny 邊緣偵測器是一種用於偵測邊緣的多層演算法。

程式碼實作：

# Apply Canny edge detector
edges = cv2.Canny(image, threshold1=100, threshold2=200)

登入後複製

建立 Flask Web 應用程式

1. 設定 Flask 應用程式

建立一個名為app.py的檔案：

from flask import Flask, request, render_template, redirect, url_for
import cv2
import os

app = Flask(__name__)

UPLOAD_FOLDER = 'static/uploads/'
OUTPUT_FOLDER = 'static/outputs/'

app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
app.config['OUTPUT_FOLDER'] = OUTPUT_FOLDER

# Create directories if they don't exist
os.makedirs(UPLOAD_FOLDER, exist_ok=True)
os.makedirs(OUTPUT_FOLDER, exist_ok=True)

登入後複製

2. 定義路線

上傳路線：

@app.route('/', methods=['GET', 'POST'])
def upload_image():
    if request.method == 'POST':
        file = request.files.get('file')
        if not file or file.filename == '':
            return 'No file selected', 400
        filepath = os.path.join(app.config['UPLOAD_FOLDER'], file.filename)
        file.save(filepath)
        process_image(file.filename)
        return redirect(url_for('display_result', filename=file.filename))
    return render_template('upload.html')

登入後複製

處理影像函數：

def process_image(filename):
    image_path = os.path.join(app.config['UPLOAD_FOLDER'], filename)
    image = cv2.imread(image_path, cv2.IMREAD_GRAYSCALE)

    # Apply edge detection
    sobelx = cv2.Sobel(image, cv2.CV_64F, 1, 0, ksize=5)
    edges = cv2.Canny(image, 100, 200)

    # Save outputs
    cv2.imwrite(os.path.join(app.config['OUTPUT_FOLDER'], 'sobelx_' + filename), sobelx)
    cv2.imwrite(os.path.join(app.config['OUTPUT_FOLDER'], 'edges_' + filename), edges)

登入後複製

結果路線：

@app.route('/result/<filename>')
def display_result(filename):
    return render_template('result.html',
                           original_image='uploads/' + filename,
                           sobelx_image='outputs/sobelx_' + filename,
                           edges_image='outputs/edges_' + filename)

登入後複製

3. 運行應用程式

if __name__ == '__main__':
    app.run(debug=True)

登入後複製

使用 Bootstrap 設計 Web 應用程式的樣式

在 HTML 範本中包含 Bootstrap CDN 以進行樣式設定。

1.上傳.html

建立templates目錄並加入upload.html：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Edge Detection App</title>
    <!-- Bootstrap CSS CDN -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>
<body>
    <div class="container mt-5">
        <h1 class="text-center mb-4">Upload an Image for Edge Detection</h1>
        <div class="row justify-content-center">
            <div class="col-md-6">
                <form method="post" enctype="multipart/form-data" class="border p-4">
                    <div class="form-group">
                        <label for="file">Choose an image:</label>
                        <input type="file" name="file" accept="image/*" required class="form-control-file" id="file">
                    </div>
                    <button type="submit" class="btn btn-primary btn-block">Upload and Process</button>
                </form>
            </div>
        </div>
    </div>
</body>
</html>

登入後複製

2.結果.html

在templates目錄下建立result.html：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Edge Detection Results</title>
    <!-- Bootstrap CSS CDN -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>
<body>
    <div class="container mt-5">
        <h1 class="text-center mb-5">Edge Detection Results</h1>
        <div class="row">
            <div class="col-md-6 mb-4">
                <h4 class="text-center">Original Image</h4>
                <img src="{{ url_for('static', filename=original_image) }}" alt="Original Image" class="img-fluid rounded mx-auto d-block">
            </div>
            <div class="col-md-6 mb-4">
                <h4 class="text-center">Sobel X</h4>
                <img src="{{ url_for('static', filename=sobelx_image) }}" alt="Sobel X" class="img-fluid rounded mx-auto d-block">
            </div>
            <div class="col-md-6 mb-4">
                <h4 class="text-center">Canny Edges</h4>
                <img src="{{ url_for('static', filename=edges_image) }}" alt="Canny Edges" class="img-fluid rounded mx-auto d-block">
            </div>
        </div>
        <div class="text-center mt-4">
            <a href="{{ url_for('upload_image') }}" class="btn btn-secondary">Process Another Image</a>
        </div>
    </div>
</body>
</html>

登入後複製

運行和測試應用程式

1. 運行 Flask 應用程式

python app.py

登入後複製

2. 存取應用程式

開啟網頁瀏覽器並導航至 http://localhost:5000。

上傳圖像並點擊「上傳並處理」。
查看邊緣偵測結果。

結果範例

Implementing Edge Detection with Python and OpenCV: A Step-by-Step Guide

結論

我們建立了一個簡單的 Web 應用程序，使用 Sobel 算子和 Canny 邊緣偵測器執行邊緣偵測。透過整合 Python、OpenCV、Flask 和 Bootstrap，我們創建了一個互動式工具，讓用戶上傳圖像並查看邊緣檢測結果。

後續步驟

增強應用程式：新增更多邊緣偵測選項或允許參數調整。
改進UI：融入更多Bootstrap元件，提供更好的使用者體驗。
進一步探索：在 Heroku 或 AWS 等其他平台上部署應用程式。

GitHub 儲存庫：邊緣偵測應用程式

以上是使用 Python 和 OpenCV 實現邊緣檢測：逐步指南的詳細內容。更多資訊請關注PHP中文網其他相關文章！

本網站聲明

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

熱AI工具

熱工具

熱門話題

Java教學

1672

CakePHP 教程

1428

Laravel 教程

1332

PHP教程

1277

C# 教程

1257

Related knowledge

Python與C：學習曲線和易用性 Apr 19, 2025 am 12:20 AM

Python更易學且易用，C 則更強大但複雜。 1.Python語法簡潔，適合初學者，動態類型和自動內存管理使其易用，但可能導致運行時錯誤。 2.C 提供低級控制和高級特性，適合高性能應用，但學習門檻高，需手動管理內存和類型安全。

學習Python：2小時的每日學習是否足夠？ Apr 18, 2025 am 12:22 AM

每天學習Python兩個小時是否足夠？這取決於你的目標和學習方法。 1)制定清晰的學習計劃，2)選擇合適的學習資源和方法，3)動手實踐和復習鞏固，可以在這段時間內逐步掌握Python的基本知識和高級功能。

Python vs.C：探索性能和效率 Apr 18, 2025 am 12:20 AM

Python在開發效率上優於C ，但C 在執行性能上更高。 1.Python的簡潔語法和豐富庫提高開發效率。 2.C 的編譯型特性和硬件控制提升執行性能。選擇時需根據項目需求權衡開發速度與執行效率。

Python vs. C：了解關鍵差異 Apr 21, 2025 am 12:18 AM

Python和C 各有優勢，選擇應基於項目需求。 1)Python適合快速開發和數據處理，因其簡潔語法和動態類型。 2)C 適用於高性能和系統編程，因其靜態類型和手動內存管理。

Python標準庫的哪一部分是：列表或數組？ Apr 27, 2025 am 12:03 AM

pythonlistsarepartofthestAndArdLibrary，herilearRaysarenot.listsarebuilt-In，多功能，和Rused ForStoringCollections，而EasaraySaraySaraySaraysaraySaraySaraysaraySaraysarrayModuleandleandleandlesscommonlyusedDduetolimitedFunctionalityFunctionalityFunctionality。

Python：自動化，腳本和任務管理 Apr 16, 2025 am 12:14 AM

Python在自動化、腳本編寫和任務管理中表現出色。 1)自動化：通過標準庫如os、shutil實現文件備份。 2)腳本編寫：使用psutil庫監控系統資源。 3)任務管理：利用schedule庫調度任務。 Python的易用性和豐富庫支持使其在這些領域中成為首選工具。

科學計算的Python：詳細的外觀 Apr 19, 2025 am 12:15 AM

Python在科學計算中的應用包括數據分析、機器學習、數值模擬和可視化。 1.Numpy提供高效的多維數組和數學函數。 2.SciPy擴展Numpy功能，提供優化和線性代數工具。 3.Pandas用於數據處理和分析。 4.Matplotlib用於生成各種圖表和可視化結果。

Web開發的Python：關鍵應用程序 Apr 18, 2025 am 12:20 AM

Python在Web開發中的關鍵應用包括使用Django和Flask框架、API開發、數據分析與可視化、機器學習與AI、以及性能優化。 1.Django和Flask框架：Django適合快速開發複雜應用，Flask適用於小型或高度自定義項目。 2.API開發：使用Flask或DjangoRESTFramework構建RESTfulAPI。 3.數據分析與可視化：利用Python處理數據並通過Web界面展示。 4.機器學習與AI：Python用於構建智能Web應用。 5.性能優化：通過異步編程、緩存和代碼優

See all articles

使用 Python 和 OpenCV 實現邊緣檢測：逐步指南

介紹

先決條件

設定環境

1.安裝所需的庫

2.建立專案目錄

實施邊緣偵測

1. 索貝爾算子

2. Canny 邊緣偵測器

建立 Flask Web 應用程式

1. 設定 Flask 應用程式

2. 定義路線

3. 運行應用程式

使用 Bootstrap 設計 Web 應用程式的樣式

1.上傳.html

2.結果.html

運行和測試應用程式

1. 運行 Flask 應用程式

2. 存取應用程式

結果範例

結論

熱AI工具

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

Video Face Swap

熱門文章

熱工具

記事本++7.3.1

SublimeText3漢化版

禪工作室 13.0.1

Dreamweaver CS6

SublimeText3 Mac版

熱門話題