-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Added new global set of images for computer vision
- Loading branch information
1 parent
6ac6656
commit 812aa22
Showing
7 changed files
with
321 additions
and
0 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,321 @@ | ||
<!doctype html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="utf-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1"> | ||
<meta name="description" content=""> | ||
<title>Computer vision Examples</title> | ||
|
||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous"> | ||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script> | ||
</head> | ||
|
||
<body> | ||
<main> | ||
<section class="py-5 text-center container"> | ||
<div class="row py-lg-5"> | ||
<div class="col-lg-6 col-md-8 mx-auto"> | ||
<h1 class="fw-light">Computer vision</h1> | ||
<p class="lead text-muted">Select an image</p> | ||
</div> | ||
</div> | ||
</section> | ||
|
||
<div class="container"> | ||
<div class="row"> | ||
<div class="col-sm"> | ||
<a data-bs-toggle="collapse" href="#collapseCityscape" role="button" aria-expanded="false" aria-controls="collapseCityscape"> | ||
<img src="images/image1.jpg" alt="Bustling urban street scene at sunset with diverse groups of people. Two women, one holding a white dog on a leash looks on. In the background, more pedestrians, | ||
including a couple holding hands. The setting features classic architecture and cobblestone streets, | ||
bathed in the warm glow of the setting sun." class="img-thumbnail"> | ||
</a> | ||
</div> | ||
<div class="col-sm"> | ||
<a data-bs-toggle="collapse" href="#collapseConstruction" role="button" aria-expanded="false" aria-controls="collapseConstruction"> | ||
<img src="images/image2.jpg" alt="A construction worker wearing a yellow hard hat and high-visibility safety vest is focused on his work at a construction site." class="img-thumbnail"> | ||
</a> | ||
</div> | ||
<div class="col-sm"> | ||
<a data-bs-toggle="collapse" href="#collapseFruitAndVeg" role="button" aria-expanded="false" aria-controls="collapseFruitAndVeg"> | ||
<img src="images/image3.jpg" alt="A vibrant and colorful assortment of fresh fruits neatly arranged in a wicker basket." class="img-thumbnail"> | ||
</a> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
|
||
|
||
<div class="container" id="collapseGroup"> | ||
<div class="row"> | ||
<div class="collapse mt-2" data-bs-parent="#collapseGroup" id="collapseCityscape"> | ||
<div class="card card-body"> | ||
<h2>Cityscape</h2> | ||
|
||
<img src="images/image1_scores.png" alt="Bustling urban street scene at sunset with diverse groups of people. Two women, one holding a white dog on a leash looks on. In the background, more pedestrians, | ||
including a couple holding hands. The setting features classic architecture and cobblestone streets, | ||
bathed in the warm glow of the setting sun." class="img-fluid w-75"> | ||
<div class="container mt-4"> | ||
|
||
<div class="row"> | ||
<div class="col-sm"> | ||
<table class="table w-50"> | ||
<tbody> | ||
<tr> | ||
<td><strong>Label</strong></td> | ||
<td><strong>Confidence</strong></td> | ||
</tr> | ||
<tr> | ||
<td>City</td> | ||
<td>100%</td> | ||
</tr> | ||
<tr> | ||
<td>Car <sup>1</sup></td> | ||
<td>100%</td> | ||
</tr> | ||
<tr> | ||
<td>Traffic light <sup>2</sup></td> | ||
<td>100%</td> | ||
</tr> | ||
<tr> | ||
<td>Person <sup>3</sup></td> | ||
<td>99%</td> | ||
</tr> | ||
<tr> | ||
<td>Tower</td> | ||
<td>77%</td> | ||
</tr> | ||
<tr> | ||
<td>Wheel <sup>4</sup></td> | ||
<td>76%</td> | ||
</tr> | ||
<tr> | ||
<td>Licence plate <sup>5</sup></td> | ||
<td>56%</td> | ||
</tr> | ||
</tbody> | ||
</table> | ||
</div> | ||
<div class="col-sm"> | ||
<table class="table w-50"> | ||
<tbody> | ||
<tr> | ||
<td><strong>Label</strong></td> | ||
<td><strong>Confidence</strong></td> | ||
</tr> | ||
<tr> | ||
<td>Street</td> | ||
<td>54%</td> | ||
</tr> | ||
<tr> | ||
<td>Road</td> | ||
<td>54%</td> | ||
</tr> | ||
<tr> | ||
<td>Pedestrian</td> | ||
<td>49%</td> | ||
</tr> | ||
<tr> | ||
<td>Pedestrian crossing</td> | ||
<td>49%</td> | ||
</tr> | ||
<tr> | ||
<td>Bus</td> | ||
<td>47%</td> | ||
</tr> | ||
<tr> | ||
<td>Bus stop</td> | ||
<td>46%</td> | ||
</tr> | ||
<tr> | ||
<td>Gate</td> | ||
<td>46%</td> | ||
</tr> | ||
</tbody> | ||
</table> | ||
</div> | ||
<!--image source: https://pixabay.com/photos/liverpool-city-centre-merseyside-4612399/--> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="collapse mt-2" data-bs-parent="#collapseGroup" id="collapseConstruction"> | ||
<div class="card card-body"> | ||
<h2>Construction Site</h2> | ||
|
||
<img src="images/image2_scores.png" alt="A construction worker wearing a yellow hard hat and high-visibility safety vest is focused on his work at a construction site. " class="img-fluid w-75"> | ||
<div class="container mt-4"> | ||
|
||
<div class="row"> | ||
<div class="col-sm"> | ||
<table class="table w-50"> | ||
<tbody> | ||
<tr> | ||
<td><strong>Label</strong></td> | ||
<td><strong>Confidence</strong></td> | ||
</tr> | ||
<tr> | ||
<td>Person <sup>1</sup></td> | ||
<td>100%</td> | ||
</tr> | ||
<tr> | ||
<td>Hard hat <sup>2</sup></td> | ||
<td>100%</td> | ||
</tr> | ||
<tr> | ||
<td>Construction <sup>3</sup></td> | ||
<td>76%</td> | ||
</tr> | ||
<tr> | ||
<td>Adult <sup>4</sup></td> | ||
<td>99%</td> | ||
</tr> | ||
<tr> | ||
<td>Male <sup>5</sup></td> | ||
<td>99%</td> | ||
</tr> | ||
|
||
</tbody> | ||
</table> | ||
</div> | ||
<div class="col-sm"> | ||
<table class="table w-50"> | ||
<tbody> | ||
<tr> | ||
<td><strong>Label</strong></td> | ||
<td><strong>Confidence</strong></td> | ||
</tr> | ||
<tr> | ||
<td>Truck <sup>6</sup></td> | ||
<td>88%</td> | ||
</tr> | ||
<tr> | ||
<td>Footwear <sup>7</sup></td> | ||
<td>88%</td> | ||
</tr> | ||
<tr> | ||
<td>Wheel <sup>8</sup></td> | ||
<td>83%</td> | ||
</tr> | ||
<tr> | ||
<td>Safety glasses</td> | ||
<td>94%</td> | ||
</tr> | ||
<tr> | ||
<td>Warning sign</td> | ||
<td>31%</td> | ||
</tr> | ||
|
||
</tbody> | ||
</table> | ||
</div> | ||
<!--image source: https://pixabay.com/photos/construction-worker-safety-2578410/--> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="collapse mt-2" data-bs-parent="#collapseGroup" id="collapseFruitAndVeg"> | ||
<div class="card card-body"> | ||
<h2>Fruit and vegetables</h2> | ||
|
||
<img src="images/image3_scores.png" alt="A vibrant and colorful assortment of fresh fruits neatly arranged in a wicker basket. The basket includes a variety of fruits such as strawberries, blueberries, oranges, grapes, and kiwis. " class="img-fluid w-75"> | ||
<div class="container mt-4"> | ||
|
||
<div class="row"> | ||
<div class="col-sm"> | ||
<table class="table w-50"> | ||
<tbody> | ||
<tr> | ||
<td><strong>Label</strong></td> | ||
<td><strong>Confidence</strong></td> | ||
</tr> | ||
<tr> | ||
<td>Banana <sup>1</sup></td> | ||
<td>100%</td> | ||
</tr> | ||
<tr> | ||
<td>Fruit</td> | ||
<td>100%</td> | ||
</tr> | ||
<tr> | ||
<td>Orange <sup>2</sup></td> | ||
<td>85%</td> | ||
</tr> | ||
<tr> | ||
<td>Pear <sup>3</sup></td> | ||
<td>84%</td> | ||
</tr> | ||
<tr> | ||
<td>Chicken <sup>4</sup></td> | ||
<td>78%</td> | ||
</tr> | ||
<tr> | ||
<td>Lemon</td> | ||
<td>62%</td> | ||
</tr> | ||
<tr> | ||
<td>Apple <sup>5</sup></td> | ||
<td>50%</td> | ||
</tr> | ||
</tbody> | ||
</table> | ||
</div> | ||
<div class="col-sm"> | ||
<table class="table w-50"> | ||
<tbody> | ||
<tr> | ||
<td><strong>Label</strong></td> | ||
<td><strong>Confidence</strong></td> | ||
</tr> | ||
<tr> | ||
<td>Basket</td> | ||
<td>55%</td> | ||
</tr> | ||
<tr> | ||
<td>Grapefruit</td> | ||
<td>53%</td> | ||
</tr> | ||
<tr> | ||
<td>Pepper</td> | ||
<td>53%</td> | ||
</tr> | ||
<tr> | ||
<td>Lime</td> | ||
<td>52%</td> | ||
</tr> | ||
<tr> | ||
<td>Courgette</td> | ||
<td>52%</td> | ||
</tr> | ||
<tr> | ||
<td>Ginger</td> | ||
<td>51%</td> | ||
</tr> | ||
<tr> | ||
<td>Avocado</td> | ||
<td>51%</td> | ||
</tr> | ||
</tbody> | ||
</table> | ||
|
||
</div> | ||
</div> | ||
<!--image source: https://pixabay.com/photos/fruit-basket-fresh-food-organic-5789565--> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</main> | ||
|
||
<footer class="text-muted py-5"> | ||
<div class="container"> | ||
<p class="float-end mb-1"> | ||
<a href="#">Back to top</a> | ||
</p> | ||
<p class="mb-1">All images found on this page have been sourced from <a href="https://pixabay.com/">Pixabay</a>. </p> | ||
<p class="mb-0">For more information on Pixabay's licencing terms, <a href="https://pixabay.com/service/license/">visit this page</a>.</p> | ||
<p class="mb-0"><a href="https://imagerecognize.com/">IMAGE Recognise</a> online application was used to classify the objects in each image </p> | ||
</div> | ||
</footer> | ||
</body> | ||
</html> |