我在eel gui中使用的按钮工作不正常?

2024-09-29 01:22:02 发布

您现在位置:Python中文网/ 问答频道 /正文

我使用eel为我的对象检测创建gui,但当我单击“单击”按钮时,它第一次不起作用,之后当我单击“第二次”时,它将运行python程序一次,第三次它将运行两次,就像这样如果单击“第四次”,它将运行检测四次,但我没有明白为什么它会这样运行

我的python代码

import cv2
import numpy as np
import sys
import eel

eel.init('web')
@eel.expose
def ob():
    net = cv2.dnn.readNet('yolov4-custom.cfg', 'yolov4.weights')

    classes = []

    with open("coco.names", "r") as f:
        classes = f.read().splitlines()

    cap = cv2.VideoCapture(0)
    # cap = cv2.VideoCapture('videoplayback.mp4')
    font = cv2.FONT_HERSHEY_PLAIN
    colors = np.random.uniform(0, 255, size=(100, 3))

    while True:
        _, img = cap.read()
        height, width, _ = img.shape

        blob = cv2.dnn.blobFromImage(img, 1 / 255, (416, 416), (0, 0, 0), swapRB=True, crop=False)
        net.setInput(blob)
        output_layers_names = net.getUnconnectedOutLayersNames()
        layerOutputs = net.forward(output_layers_names)

        boxes = []
        confidences = []
        class_ids = []

        for output in layerOutputs:
            for detection in output:
                scores = detection[5:]
                class_id = np.argmax(scores)
                confidence = scores[class_id]
                if confidence > 0.2:
                    center_x = int(detection[0] * width)
                    center_y = int(detection[1] * height)
                    w = int(detection[2] * width)
                    h = int(detection[3] * height)
                    x = int(center_x - w / 2)
                    y = int(center_y - h / 2)

                    boxes.append([x, y, w, h])
                    confidences.append((float(confidence)))
                    class_ids.append(class_id)

        indexes = cv2.dnn.NMSBoxes(boxes, confidences, 0.2, 0.4)

        if len(indexes) > 0:
            for i in indexes.flatten():
                x, y, w, h = boxes[i]
                label = str(classes[class_ids[i]])
                confidence = str(round(confidences[i], 2))
                color = colors[i]
                cv2.rectangle(img, (x, y), (x + w, y + h), color, 2)
                cv2.putText(img, label + " " + confidence, (x, y + 20), font, 2, (255, 255, 255), 2)

        cv2.imshow('Image', img)
        key = cv2.waitKey(1)
        if key == 27:
            break

    cap.release()
    cv2.destroyAllWindows()



eel.start('index.html',size=(1000,600))

我的html文件


<!DOCTYPE html>
<html  >
<head>
  <!-- Site made with Mobirise Website Builder v5.2.0, https://mobirise.com -->
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="generator" content="Mobirise v5.2.0, mobirise.com">
  <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
  <link rel="shortcut icon" href="assets/images/untitled-design-1.png" type="image/x-icon">
  <meta name="description" content="">
 
  <title>INDEX</title>
  <link rel="stylesheet" href="assets/web/assets/mobirise-icons2/mobirise2.css">
  <link rel="stylesheet" href="assets/tether/tether.min.css">
  <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
  <link rel="stylesheet" href="assets/bootstrap/css/bootstrap-grid.min.css">
  <link rel="stylesheet" href="assets/bootstrap/css/bootstrap-reboot.min.css">
  <link rel="stylesheet" href="assets/dropdown/css/style.css">
  <link rel="stylesheet" href="assets/socicon/css/styles.css">
  <link rel="stylesheet" href="assets/theme/css/style.css">
  <link rel="preload" as="style" href="assets/mobirise/css/mbr-additional.css"><link rel="stylesheet" href="assets/mobirise/css/mbr-additional.css" type="text/css">
  
  
  
  
</head>
<body>
  
  <section class="menu menu2 cid-smCynu8aVf" once="menu" id="menu2-2">
    
    <nav class="navbar navbar-dropdown navbar-fixed-top navbar-expand-lg">
        <div class="container">
            <div class="navbar-brand">
                <span class="navbar-logo">
                    <a href="https://mobiri.se">
                        <img src="assets/images/untitled-design-1.png" alt="Mobirise" style="height: 3.6rem;">
                    </a>
                </span>
                <span class="navbar-caption-wrap"><a class="navbar-caption text-primary display-7" href="index.html">OBJECT DETECTION SYSTEM</a></span>
            </div>
            
            
        </div>
    </nav>
</section>

<section class="header19 cid-smCA52VXY0 mbr-fullscreen" id="header19-3">

    

    

    <div class="container">
        <div class="media-container">
            <div class="col-md-12 align-center">
                <h1 class="mbr-section-title mbr-white mbr-bold mbr-fonts-style mb-3 display-1">OBJECT DETECTION SYSTEM</h1>
                
                

                <div class="row justify-content-center">
                    <div class="col-12 col-md-6 col-lg-3">
                        <div class="card-wrapper">
                            <div class="card-box align-center">
                                <span class="mbr-iconfont mobi-mbri-layers mobi-mbri"></span>
                                <h4 class="card-title align-center mbr-black mbr-fonts-style display-5"><strong>DETECT</strong></h4>
                            </div>
                        </div>
                    </div>
                    
                    
                    
                </div>
            </div>
        </div>
    </div>
</section>

<section class="header18 cid-smCBsSuhkK mbr-fullscreen" id="header18-7">

    

    

    <div class="align-center container">
        <div class="row justify-content-center">
            <div class="col-12 col-lg-10">
                <h1 class="mbr-section-title mbr-fonts-style mbr-white mb-3 display-1"><strong>CLICK TO REDIRECT TO LIVE OBJECT DECTECTION PAGE</strong></h1>
                <script type="text/javascript">

                    function object1(){

    document.getElementById("clickbtn").addEventListener("click", ()=>{eel.ob()} , false);

}



                </script>>

                <div class="mbr-section-btn mt-3"><a class="btn btn-primary display-4" id="clickbtn" onclick="object1()">CLICK</a></div>
            </div>
        </div>
    </div>
</section><section style="background-color: #fff; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif; color:#aaa; font-size:12px; padding: 0; align-items: center; display: flex;"><a href="https://mobirise.site/z" style="flex: 1 1; height: 3rem; padding-left: 1rem;"></a><p style="flex: 0 0 auto; margin:0; padding-right:1rem;">Created with <a href="https://mobirise.site/a" style="color:#aaa;">Mobirise</a></p></section><script src="assets/web/assets/jquery/jquery.min.js"></script>  <script src="assets/popper/popper.min.js"></script>  <script src="assets/tether/tether.min.js"></script>  <script src="assets/bootstrap/js/bootstrap.min.js"></script>  <script src="assets/smoothscroll/smooth-scroll.js"></script>  <script src="assets/dropdown/js/nav-dropdown.js"></script>  <script src="assets/dropdown/js/navbar-dropdown.js"></script>  <script src="assets/touchswipe/jquery.touch-swipe.min.js"></script>  <script src="assets/vimeoplayer/jquery.mb.vimeo_player.js"></script>  <script src="assets/theme/js/script.js"></script>


</body>

</html>

上面html文件中的按钮脚本包含代码,当我单击按钮时,它将运行对象检测

<script type="text/javascript">

                    function object1(){

    document.getElementById("clickbtn").addEventListener("click", ()=>{eel.ob()} , false);

}



                </script>

                <div class="mbr-section-btn mt-3"><a class="btn btn-primary display-4" id="clickbtn" onclick="object1()">CLICK</a></div>

Tags: divsrcstylejslinkscriptsectioncv2