Implementierung der Kantenerkennung mit Python und OpenCV: Eine Schritt-für-Schritt-Anleitung-Python-Tutorial-php.cn

Implementierung der Kantenerkennung mit Python und OpenCV: Eine Schritt-für-Schritt-Anleitung

DDD

Freigeben： 2024-10-20 06:10:02

Original

1022 Leute haben es durchsucht

Einführung

Die Kantenerkennung ist in der Bildverarbeitung von grundlegender Bedeutung und ermöglicht es uns, Objektgrenzen in Bildern zu identifizieren. In diesem Tutorial implementieren wir die Kantenerkennung mithilfe des Sobel-Operators und des Canny-Kantendetektors mit Python und OpenCV. Anschließend erstellen wir mit Flask eine einfache Webanwendung, die mit Bootstrap gestaltet ist, damit Benutzer Bilder hochladen und die Ergebnisse anzeigen können.

DEMO-LINK:Kantenerkennungs-Demo

Voraussetzungen

Python 3.x ist auf Ihrem Computer installiert.
Grundkenntnisse der Python-Programmierung.
Kenntnisse mit HTML und CSS sind hilfreich, aber nicht erforderlich.

Einrichten der Umgebung

1. Installieren Sie die erforderlichen Bibliotheken

Öffnen Sie Ihr Terminal oder Ihre Eingabeaufforderung und führen Sie Folgendes aus:

pip install opencv-python numpy Flask

Nach dem Login kopieren

2. Erstellen Sie das Projektverzeichnis

mkdir edge_detection_app
cd edge_detection_app

Nach dem Login kopieren

Implementierung der Kantenerkennung

1. Der Sobel-Operator

Der Sobel-Operator berechnet den Gradienten der Bildintensität und betont Kanten.

Code-Implementierung:

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

Nach dem Login kopieren

2. Der Canny Edge Detector

Der Canny-Kantendetektor ist ein mehrstufiger Algorithmus zur Kantenerkennung.

Code-Implementierung:

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

Nach dem Login kopieren

Erstellen einer Flask-Webanwendung

1. Richten Sie die Flask-App ein

Erstellen Sie eine Datei mit dem Namen 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)

Nach dem Login kopieren

2. Routen definieren

Route hochladen:

@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')

Nach dem Login kopieren

Prozessbildfunktion:

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)

Nach dem Login kopieren

Ergebnisroute:

@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)

Nach dem Login kopieren

3. Führen Sie die App aus

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

Nach dem Login kopieren

Gestalten der Webanwendung mit Bootstrap

Fügen Sie Bootstrap CDN zur Gestaltung in Ihre HTML-Vorlagen ein.

1. upload.html

Erstellen Sie ein Vorlagenverzeichnis und fügen Sie upload.html hinzu:

<!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>

Nach dem Login kopieren

2. result.html

Erstellen Sie result.html im Vorlagenverzeichnis:

<!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>

Nach dem Login kopieren

Ausführen und Testen der Anwendung

1. Führen Sie die Flask-App aus

python app.py

Nach dem Login kopieren

2. Greifen Sie auf die Anwendung zu

Öffnen Sie Ihren Webbrowser und navigieren Sie zu http://localhost:5000.

Laden Sie ein Bild hoch und klicken Sie auf Hochladen und verarbeiten.
Sehen Sie sich die Ergebnisse der Kantenerkennung an.

BEISPIELERGEBNIS

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

Abschluss

Wir haben eine einfache Webanwendung erstellt, die die Kantenerkennung mithilfe des Sobel-Operators und des Canny-Kantendetektors durchführt. Durch die Integration von Python, OpenCV, Flask und Bootstrap haben wir ein interaktives Tool erstellt, mit dem Benutzer Bilder hochladen und Kantenerkennungsergebnisse anzeigen können.

Nächste Schritte

Verbessern Sie die Anwendung: Fügen Sie weitere Kantenerkennungsoptionen hinzu oder erlauben Sie Parameteranpassungen.
Verbessern Sie die Benutzeroberfläche: Integrieren Sie mehr Bootstrap-Komponenten für ein besseres Benutzererlebnis.
Weitere Informationen: Stellen Sie die App auf anderen Plattformen wie Heroku oder AWS bereit.

GitHub Repository: Edge-Erkennungs-App

Das obige ist der detaillierte Inhalt vonImplementierung der Kantenerkennung mit Python und OpenCV: Eine Schritt-für-Schritt-Anleitung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!