Skip to content

Commit

Permalink
Added new global set of images for computer vision
Browse files Browse the repository at this point in the history
  • Loading branch information
bengarside82 authored Jul 6, 2024
1 parent 6ac6656 commit 812aa22
Show file tree
Hide file tree
Showing 7 changed files with 321 additions and 0 deletions.
Binary file added computer-vision-global/images/image1.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added computer-vision-global/images/image1_scores.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added computer-vision-global/images/image2.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added computer-vision-global/images/image2_scores.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added computer-vision-global/images/image3.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added computer-vision-global/images/image3_scores.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
321 changes: 321 additions & 0 deletions computer-vision-global/index.html
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>

0 comments on commit 812aa22

Please sign in to comment.