<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	
	xmlns:georss="http://www.georss.org/georss"
	xmlns:geo="http://www.w3.org/2003/01/geo/wgs84_pos#"
	>

<channel>
	<title>Zarządzanie danymi - Inero Software - Rozwiązania IT i Konsulting</title>
	<atom:link href="https://inero-software.com/pl/tag/zarzadzanie-danymi/feed/" rel="self" type="application/rss+xml" />
	<link>https://inero-software.com/pl/tag/zarzadzanie-danymi/</link>
	<description>Tworzymy cyfrowe innowacje</description>
	<lastBuildDate>Wed, 20 Nov 2024 14:47:40 +0000</lastBuildDate>
	<language>pl-PL</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.1</generator>

<image>
	<url>https://inero-software.com/wp-content/uploads/2018/11/inero-logo-favicon.png</url>
	<title>Zarządzanie danymi - Inero Software - Rozwiązania IT i Konsulting</title>
	<link>https://inero-software.com/pl/tag/zarzadzanie-danymi/</link>
	<width>32</width>
	<height>32</height>
</image> 
<site xmlns="com-wordpress:feed-additions:1">153509928</site>	<item>
		<title>Sieci neuronowe w przeglądarce: Przewodnik na przykładzie customowej sieci YOLO do wykrywania twarzy</title>
		<link>https://inero-software.com/pl/sieci-neuronowe-w-przegladarce-przewodnik-na-przykladzie-customowej-sieci-yolo-do-wykrywania-twarzy/</link>
		
		<dc:creator><![CDATA[Martyna Mul]]></dc:creator>
		<pubDate>Thu, 10 Oct 2024 11:20:57 +0000</pubDate>
				<category><![CDATA[Firma]]></category>
		<category><![CDATA[ML]]></category>
		<category><![CDATA[NLP]]></category>
		<category><![CDATA[oprogramowanie]]></category>
		<category><![CDATA[optymalizacja procesów biznesowych]]></category>
		<category><![CDATA[repozytorium]]></category>
		<category><![CDATA[sieci neuronowe]]></category>
		<category><![CDATA[yolo]]></category>
		<category><![CDATA[zarządzanie danymi]]></category>
		<guid isPermaLink="false">https://inero-software.com/?p=6230</guid>

					<description><![CDATA[<p>Wraz z rosnącym zapotrzebowaniem na aplikacje działające w czasie rzeczywistym, uruchamianie modeli głębokiego uczenia w przeglądarce staje się coraz bardziej dostępne i wydajne. W tym artykule pokażemy, jak zaimplementować wykrywanie obiektów bezpośrednio w przeglądarce, wykorzystując YOLO (You Only Look Once) oraz TensorFlow.js. Skoncentrujemy się na zastosowaniu wytrenowanego przez nas niestandardowego&#8230;</p>
<p>Artykuł <a href="https://inero-software.com/pl/sieci-neuronowe-w-przegladarce-przewodnik-na-przykladzie-customowej-sieci-yolo-do-wykrywania-twarzy/">Sieci neuronowe w przeglądarce: Przewodnik na przykładzie customowej sieci YOLO do wykrywania twarzy</a> pochodzi z serwisu <a href="https://inero-software.com/pl">Inero Software - Rozwiązania IT i Konsulting</a>.</p>
]]></description>
										<content:encoded><![CDATA[		<div data-elementor-type="wp-post" data-elementor-id="6230" class="elementor elementor-6230" data-elementor-post-type="post">
				<div class="elementor-element elementor-element-d225397 e-flex e-con-boxed e-con e-parent" data-id="d225397" data-element_type="container">
					<div class="e-con-inner">
				<div class="elementor-element elementor-element-4df78db elementor-widget elementor-widget-html" data-id="4df78db" data-element_type="widget" data-widget_type="html.default">
				<div class="elementor-widget-container">
					</div>
				</div>
					</div>
				</div>
		<div class="elementor-element elementor-element-0827b19 e-flex e-con-boxed e-con e-parent" data-id="0827b19" data-element_type="container">
					<div class="e-con-inner">
		<div class="elementor-element elementor-element-afa200d e-con-full e-flex e-con e-child" data-id="afa200d" data-element_type="container">
				</div>
		<div class="elementor-element elementor-element-3302212 e-con-full e-flex e-con e-child" data-id="3302212" data-element_type="container">
				<div class="elementor-element elementor-element-640ca1b elementor-widget elementor-widget-text-editor" data-id="640ca1b" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p><strong>Wraz z rosnącym zapotrzebowaniem na aplikacje działające w czasie rzeczywistym, uruchamianie modeli głębokiego uczenia w przeglądarce staje się coraz bardziej dostępne i wydajne. W tym artykule pokażemy, jak zaimplementować wykrywanie obiektów bezpośrednio w przeglądarce, wykorzystując YOLO (You Only Look Once) oraz TensorFlow.js. Skoncentrujemy się na zastosowaniu wytrenowanego przez nas niestandardowego modelu YOLOv8 do wykrywania ludzkich twarzy. Na końcu tego przewodnika dowiesz się, jak skonfigurować i uruchomić model YOLO do wykrywania twarzy za pomocą TensorFlow.js, przetworzyć wyniki i zoptymalizować wydajność – wszystko to bez potrzeby korzystania z serwera czy przetwarzania po stronie backendu.</strong></p>						</div>
				</div>
				<div class="elementor-element elementor-element-aed25a2 elementor-widget elementor-widget-heading" data-id="aed25a2" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<h3 class="elementor-heading-title elementor-size-default">Dlaczego warto korzystać z sieci neuronowych w przeglądarce?</h3>		</div>
				</div>
				<div class="elementor-element elementor-element-344fad5 elementor-widget elementor-widget-text-editor" data-id="344fad5" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Uruchamianie sieci neuronowych w przeglądarce ma wiele zalet. Najważniejsze z nich to:</p><ol><li><strong>Niskie opóźnienia</strong>: Wszystko odbywa się po stronie klienta, co eliminuje opóźnienia wynikające z przesyłania danych na serwer i oczekiwania na odpowiedź.</li><li><strong>Większa prywatność</strong>: Wrażliwe dane pozostają na urządzeniu użytkownika, co minimalizuje ryzyko ich naruszenia lub ujawnienia.</li><li><strong> Możliwość użycia offline</strong>: Użytkownicy mogą korzystać z funkcji uczenia maszynowego nawet bez stałego połączenia z internetem.</li><li><strong>Kompatybilność między platformami</strong>: Aplikacja działa na każdym urządzeniu z przeglądarką – niezależnie czy to komputer, tablet, czy smartfon.</li></ol>						</div>
				</div>
				<div class="elementor-element elementor-element-9e13d20 elementor-widget elementor-widget-heading" data-id="9e13d20" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<h3 class="elementor-heading-title elementor-size-default">Wybór i przygotowanie sieci neuronowej</h3>		</div>
				</div>
				<div class="elementor-element elementor-element-769829b elementor-widget elementor-widget-text-editor" data-id="769829b" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Przy wyborze sieci neuronowej do implementacji w przeglądarce warto uwzględnić takie czynniki jak rozmiar modelu, szybkość działania, zużycie pamięci oraz kompatybilność z technologiami przeglądarkowymi, np. WebGL. Dla optymalnej wydajności na urządzeniach o ograniczonych zasobach zaleca się stosowanie modeli o rozmiarze poniżej 30 MB. Do odpowiednich modeli należą MobileNetV2, SqueezeNet, EfficientNet oraz wybrane warianty YOLO. My zdecydowaliśmy się na wytrenowany przez nas model YOLOv8 do wykrywania ludzkich twarzy na obrazach.</p><p>Jeśli Twój model przekracza zalecany rozmiar, warto rozważyć techniki optymalizacji, takie jak kwantyzacja (quantization) i przycinanie (pruning). Kwantyzacja zmniejsza precyzję wag modelu, zazwyczaj konwertując wartości zmiennoprzecinkowe 32-bitowe na liczby zmiennoprzecinkowe 16-bitowe lub całkowite 8-bitowe. Przycinanie usuwa zbędne połączenia w sieci neuronowej. Obie metody zmniejszają rozmiar modelu i redukują złożoność obliczeniową, co poprawia szybkość inferencji – szczególnie na urządzeniach takich jak smartfony – choć mogą one nieznacznie wpłynąć na dokładność.</p>						</div>
				</div>
				<div class="elementor-element elementor-element-76a71b3 elementor-widget elementor-widget-heading" data-id="76a71b3" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<h3 class="elementor-heading-title elementor-size-default">Optymalizacja YOLOv8 do wykrywania twarzy: wyniki naszego niestandardowego modelu
</h3>		</div>
				</div>
				<div class="elementor-element elementor-element-9111e72 elementor-widget elementor-widget-text-editor" data-id="9111e72" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Nasz model YOLOv8 został wytrenowany na niestandardowym zbiorze danych w celu automatycznego sprawdzania, czy załącznik zawiera wyraźne zdjęcie ludzkiej twarzy, skierowanej na wprost i niezasłoniętej, np. przez maskę. Taka funkcjonalność jest szczególnie przydatna w systemach obiegu dokumentów, gdzie weryfikacja tożsamości wymaga widoczności twarzy. Zbiór danych składał się z 1500 obrazów, z czego 1200 wykorzystano do treningu, a 300 do walidacji. Dataset zawierał zdjęcia twarzy fotografowanych z różnych kątów, twarzy częściowo zasłoniętych oraz zdjęcia innych obiektów. Dzięki treningowi model nauczył się skutecznie wykrywać twarze spełniające wymagane kryteria. Poniższe przykłady ilustrują, jak model działa w praktyce. Dwie twarze po lewej stronie zostały poprawnie wykryte, podczas gdy dwie po prawej nie zostały rozpoznane, ponieważ były częściowo zasłonięte:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-fd798a3 elementor-widget elementor-widget-image" data-id="fd798a3" data-element_type="widget" data-widget_type="image.default">
				<div class="elementor-widget-container">
													<img fetchpriority="high" decoding="async" width="934" height="258" src="https://inero-software.com/wp-content/uploads/2024/10/9102024gr1.jpg" class="attachment-large size-large wp-image-6206" alt="" srcset="https://inero-software.com/wp-content/uploads/2024/10/9102024gr1.jpg 934w, https://inero-software.com/wp-content/uploads/2024/10/9102024gr1-300x83.jpg 300w, https://inero-software.com/wp-content/uploads/2024/10/9102024gr1-768x212.jpg 768w" sizes="(max-width: 934px) 100vw, 934px" data-attachment-id="6206" data-permalink="https://inero-software.com/running-ai-in-client-side-real-time-face-detection-in-the-browser-using-yolo-and-tensorflow-js-use-case-study/9102024gr1/" data-orig-file="https://inero-software.com/wp-content/uploads/2024/10/9102024gr1.jpg" data-orig-size="934,258" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="9102024gr1" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2024/10/9102024gr1-300x83.jpg" data-large-file="https://inero-software.com/wp-content/uploads/2024/10/9102024gr1.jpg" role="button" />													</div>
				</div>
				<div class="elementor-element elementor-element-34bbb24 elementor-widget elementor-widget-heading" data-id="34bbb24" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<p class="elementor-heading-title elementor-size-default">(source of images: https://www.kaggle.com/datasets/ashwingupta3012/human-faces, https://www.kaggle.com/datasets/andrewmvd/face-mask-detection) </p>		</div>
				</div>
				<div class="elementor-element elementor-element-12bfcb4 elementor-widget elementor-widget-text-editor" data-id="12bfcb4" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Wyniki wnioskowania na czterech przykładach – dwie twarze po lewej stronie zostały poprawnie wykryte, natomiast dwie po prawej nie, ponieważ były częściowo zasłonięte.</p><p>Jako bazowy model dla naszego projektu wybraliśmy YOLOv8s (small), co dało model o rozmiarze 44 MB, osiągający 99,9% precyzji (ang. precision) oraz 99,1% czułości (ang. recall) na naszym niestandardowym zbiorze danych walidacyjnych. W celu optymalizacji przetestowaliśmy również mniejszy model bazowy, YOLOv8n (nano), oraz przeanalizowaliśmy efekty kwantyzacji. Trening z modelem YOLOv8n dał model o rozmiarze zaledwie 12 MB, przy niemal identycznych wynikach – 99,7% precyzji i 99,1% czułości. Następnie przeprowadziliśmy kwantyzację obu modeli, a ich rozmiary oraz dokładność po kwantyzacji zostały zaprezentowane w poniższej tabeli:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-859298c elementor-widget elementor-widget-text-editor" data-id="859298c" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<table class=" aligncenter" style="font-weight: 400;" data-tablestyle="MsoNormalTable" data-tablelook="1568" aria-rowcount="4"><tbody><tr aria-rowindex="1"><td colspan="1" rowspan="2" data-celllook="69905"><p><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td colspan="3" data-celllook="69905"><p><strong>Model bazowy</strong></p><p> </p></td><td colspan="3" data-celllook="69905"><p><strong>Model kwantyzowany 16-bitowy</strong></p><p> </p></td></tr><tr aria-rowindex="2"><td data-celllook="69905"><p><b><span data-contrast="auto">Rozmiar</span></b><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><b>Precyzja</b></p></td><td data-celllook="69905"><p><b><span data-contrast="auto">Recall</span></b><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><b><span data-contrast="auto">Rozmiar</span></b><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><b>Precyzja</b></p></td><td data-celllook="69905"><p><b><span data-contrast="auto">Recall</span></b><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td></tr><tr aria-rowindex="3"><td data-celllook="69905"><p><b><span data-contrast="auto">YOLOv8 small</span></b><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><b><span data-contrast="auto">44 MB</span></b><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><span data-contrast="auto">0.999</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><span data-contrast="auto">0.991</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><span data-contrast="auto">22 MB</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><span data-contrast="auto">0.997</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><span data-contrast="auto">0.991</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td></tr><tr aria-rowindex="4"><td data-celllook="69905"><p><b><span data-contrast="auto">YOLOv8 nano</span></b><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><span data-contrast="auto">12 MB</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><span data-contrast="auto">0.997</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><span data-contrast="auto">0.991</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><b><span data-contrast="auto">6 MB</span></b><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><span data-contrast="auto">0.989</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td><td data-celllook="69905"><p><span data-contrast="auto">0.991</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335551550&quot;:6,&quot;335551620&quot;:6,&quot;335559740&quot;:360}"> </span></p></td></tr></tbody></table>						</div>
				</div>
				<div class="elementor-element elementor-element-a7be2ba elementor-widget elementor-widget-text-editor" data-id="a7be2ba" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p><strong>Uwaga: </strong>Czułość mierzy, ile rzeczywistych pozytywnych próbek zostało poprawnie zidentyfikowanych (tutaj: ile twarzy zostało poprawnie wykrytych), natomiast precyzja wskazuje, ile próbek zidentyfikowanych przez model jako pozytywne było faktycznie pozytywnych (tutaj: ile obiektów wykrytych przez model to faktycznie ludzkie twarze). W idealnym przypadku oba wskaźniki wynoszą 1.</p><p>W naszym przykładzie, zastosowanie mniejszego modelu bazowego wraz z kwantyzacją zmniejszyło dokładność o mniej niż 1%, jednocześnie redukując rozmiar modelu z 44 MB do zaledwie 6 MB.</p><p>Poniżej przedstawiamy kilka przykładowych zdjęć, które pokazują, jak działają dwa modele: YOLOv8s i YOLOv8n z kwantyzacją.</p>						</div>
				</div>
				<div class="elementor-element elementor-element-ba300a9 elementor-widget elementor-widget-image" data-id="ba300a9" data-element_type="widget" data-widget_type="image.default">
				<div class="elementor-widget-container">
													<img decoding="async" width="934" height="307" src="https://inero-software.com/wp-content/uploads/2024/10/9102024gr2.jpg" class="attachment-large size-large wp-image-6208" alt="" srcset="https://inero-software.com/wp-content/uploads/2024/10/9102024gr2.jpg 934w, https://inero-software.com/wp-content/uploads/2024/10/9102024gr2-300x99.jpg 300w, https://inero-software.com/wp-content/uploads/2024/10/9102024gr2-768x252.jpg 768w, https://inero-software.com/wp-content/uploads/2024/10/9102024gr2-913x300.jpg 913w" sizes="(max-width: 934px) 100vw, 934px" data-attachment-id="6208" data-permalink="https://inero-software.com/running-ai-in-client-side-real-time-face-detection-in-the-browser-using-yolo-and-tensorflow-js-use-case-study/9102024gr2/" data-orig-file="https://inero-software.com/wp-content/uploads/2024/10/9102024gr2.jpg" data-orig-size="934,307" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="9102024gr2" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2024/10/9102024gr2-300x99.jpg" data-large-file="https://inero-software.com/wp-content/uploads/2024/10/9102024gr2.jpg" role="button" />													</div>
				</div>
				<div class="elementor-element elementor-element-3d14285 elementor-widget elementor-widget-text-editor" data-id="3d14285" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Wyniki inferencji z modelem YOLOv8s, bez kwantyzacji (o rozmiarze 44 MB):</p><p><span class="TextRun SCXW46079478 BCX0" lang="EN-US" xml:lang="EN-US" data-contrast="auto"><span class="NormalTextRun SCXW46079478 BCX0">(source of images: </span><span class="NormalTextRun SCXW46079478 BCX0">https://www.kaggle.com/datasets/ashwingupta3012/human-faces</span><span class="NormalTextRun SCXW46079478 BCX0">).</span></span></p>						</div>
				</div>
				<div class="elementor-element elementor-element-e4f1955 elementor-widget elementor-widget-image" data-id="e4f1955" data-element_type="widget" data-widget_type="image.default">
				<div class="elementor-widget-container">
													<img decoding="async" width="934" height="313" src="https://inero-software.com/wp-content/uploads/2024/10/9102024gr3.jpg" class="attachment-large size-large wp-image-6207" alt="" srcset="https://inero-software.com/wp-content/uploads/2024/10/9102024gr3.jpg 934w, https://inero-software.com/wp-content/uploads/2024/10/9102024gr3-300x101.jpg 300w, https://inero-software.com/wp-content/uploads/2024/10/9102024gr3-768x257.jpg 768w, https://inero-software.com/wp-content/uploads/2024/10/9102024gr3-895x300.jpg 895w" sizes="(max-width: 934px) 100vw, 934px" data-attachment-id="6207" data-permalink="https://inero-software.com/running-ai-in-client-side-real-time-face-detection-in-the-browser-using-yolo-and-tensorflow-js-use-case-study/9102024gr3/" data-orig-file="https://inero-software.com/wp-content/uploads/2024/10/9102024gr3.jpg" data-orig-size="934,313" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="9102024gr3" data-image-description="" data-image-caption="" data-medium-file="https://inero-software.com/wp-content/uploads/2024/10/9102024gr3-300x101.jpg" data-large-file="https://inero-software.com/wp-content/uploads/2024/10/9102024gr3.jpg" role="button" />													</div>
				</div>
				<div class="elementor-element elementor-element-8185505 elementor-widget elementor-widget-text-editor" data-id="8185505" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Wyniki inferencji z modelem YOLOv8n po kwantyzacji 16-bitowej (o rozmiarze 6 MB). Różnica w poziomie ufności jest minimalna, natomiast położenie wykrytych obiektów pozostało takie samo.</p><p>Przetestowaliśmy wydajność dwóch modeli — YOLOv8s (44 MB) i YOLOv8n po kwantyzacji 16-bitowej (6 MB) — na trzech różnych procesorach. Mniejszy model, YOLOv8n, konsekwentnie przewyższał swój większy odpowiednik pod względem czasu wczytania modelu oraz szybkości pojedynczej inferencji. Szczegółowe dane dotyczące wydajności zostały podsumowane w tabeli poniżej.</p>						</div>
				</div>
				<div class="elementor-element elementor-element-bba7a47 elementor-widget elementor-widget-text-editor" data-id="bba7a47" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<table style="font-weight: 400;" data-tablestyle="MsoTableGrid" data-tablelook="1696" aria-rowcount="5"><tbody><tr aria-rowindex="1"><td colspan="1" rowspan="2" data-celllook="0"><p><span data-ccp-props="{}"> </span></p></td><td colspan="3" data-celllook="0"><p><strong>Ładowanie modelu</strong></p></td><td colspan="3" data-celllook="0"><p><strong>Pojedyncze wnioskowanie</strong></p></td></tr><tr aria-rowindex="2"><td data-celllook="0"><p><b><span data-contrast="auto">CPU 1</span></b><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><b><span data-contrast="auto">CPU 2</span></b><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><b><span data-contrast="auto">CPU 3</span></b><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><b><span data-contrast="auto">CPU 1</span></b><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><b><span data-contrast="auto">CPU 2</span></b><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><b><span data-contrast="auto">CPU 3</span></b><span data-ccp-props="{}"> </span></p></td></tr><tr aria-rowindex="3"><td data-celllook="0"><p><b><span data-contrast="auto">YOLOv8 small</span></b><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">1050 ms</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">3700 ms</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">4200 ms</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">21 ms</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">117.5 ms</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">196.5 ms</span><span data-ccp-props="{}"> </span></p></td></tr><tr aria-rowindex="4"><td data-celllook="0"><p><b><span data-contrast="auto">YOLOv8 nano 16-bit</span></b><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">980 ms</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">3200 ms</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">3700 ms</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">16 ms</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">112.5 ms</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">189 ms</span><span data-ccp-props="{}"> </span></p></td></tr><tr aria-rowindex="5"><td data-celllook="0"><p>Przyspieszenie</p></td><td data-celllook="0"><p><span data-contrast="auto">6.7 %</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">13.5 %</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">11.9 %</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">23.8 %</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">4.2 %</span><span data-ccp-props="{}"> </span></p></td><td data-celllook="0"><p><span data-contrast="auto">3.8 %</span><span data-ccp-props="{}"> </span></p></td></tr></tbody></table>						</div>
				</div>
				<div class="elementor-element elementor-element-cc12989 elementor-widget elementor-widget-text-editor" data-id="cc12989" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Oprócz czasu wczytania modelu i inferencji, istotnym czynnikiem do rozważenia jest również czas pobrania modelu, który nie został uwzględniony w tabeli. Czas ten jest bezpośrednio proporcjonalny do rozmiaru modelu i w znacznym stopniu zależy od prędkości połączenia internetowego użytkownika.</p>						</div>
				</div>
				<div class="elementor-element elementor-element-d6f4734 elementor-widget elementor-widget-heading" data-id="d6f4734" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<h3 class="elementor-heading-title elementor-size-default">Praktyczna implementacja krok po kroku</h3>		</div>
				</div>
				<div class="elementor-element elementor-element-e00fb33 elementor-widget elementor-widget-text-editor" data-id="e00fb33" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Aby wdrożyć model uczenia maszynowego w przeglądarce, skorzystamy z TensorFlow.js — popularnej biblioteki, która umożliwia uruchamianie wytrenowanych modeli lub całkowite trenowanie nowych modeli bezpośrednio w przeglądarce. W tym przewodniku skupimy się na wdrożeniu wytrenowanego modelu YOLOv8 do wykrywania twarzy. Poniżej znajdziesz instrukcję, jak krok po kroku skonfigurować środowisko i uruchomić model z TensorFlow.js.</p>						</div>
				</div>
				<div class="elementor-element elementor-element-d18e614 elementor-widget elementor-widget-heading" data-id="d18e614" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<h4 class="elementor-heading-title elementor-size-default">1. Instalacja TensorFlow.js </h4>		</div>
				</div>
				<div class="elementor-element elementor-element-cb9241f elementor-widget elementor-widget-text-editor" data-id="cb9241f" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Najłatwiejszą metodą instalacji Tensorflow.js jest użycie npm:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-c5deef0 elementor-widget elementor-widget-text-editor" data-id="c5deef0" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre>npm install @tensorflow/tfjs </pre>						</div>
				</div>
				<div class="elementor-element elementor-element-cd338d1 elementor-widget elementor-widget-heading" data-id="cd338d1" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<h4 class="elementor-heading-title elementor-size-default">2. Wczytanie modelu</h4>		</div>
				</div>
				<div class="elementor-element elementor-element-d54d572 elementor-widget elementor-widget-text-editor" data-id="d54d572" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Ponieważ używamy biblioteki TensorFlow.js, musisz przekonwertować swój model na format TensorFlow.js (Tf.js). W przypadku modeli YOLO, twórcy Ultralytics udostępnili łatwy sposób na dokonanie tego za pomocą prostego polecenia:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-8acf4f8 elementor-widget elementor-widget-text-editor" data-id="8acf4f8" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre><span class="TextRun Highlight SCXW164933469 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW164933469 BCX0">yolo </span></span><span class="TextRun Highlight SCXW164933469 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW164933469 BCX0">export</span></span><span class="TextRun Highlight SCXW164933469 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW164933469 BCX0"> model=path/to/best.pt format=tfjs</span></span><span class="EOP SCXW164933469 BCX0" data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span></pre>						</div>
				</div>
				<div class="elementor-element elementor-element-a9c3625 elementor-widget elementor-widget-text-editor" data-id="a9c3625" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Po konwersji Twój model zostanie zapisany jako pliki binarne wraz z plikiem JSON o nazwie <strong>model.json</strong>. Wówczas możesz wczytać model korzystając z funkcji <strong>tf.loadGraphModel()</strong>. Poniżej znajdziesz przykład implementacji. Zwróć uwagę na dodatkowy etap &#8222;rozgrzewki&#8221; modelu, poprzez wykonanie jednokrotnej inferencji na losowych danych wejściowych. Ten krok poprawi wydajność modelu przy kolejnej inferencji.</p>						</div>
				</div>
				<div class="elementor-element elementor-element-8ae265d elementor-widget elementor-widget-text-editor" data-id="8ae265d" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">export</span></span> <span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">async</span></span> <span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">function</span></span> <span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">loadModel</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">(modelPath) {</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW28304209 BCX0"><span class="SCXW28304209 BCX0"> </span><br class="SCXW28304209 BCX0" /></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">  </span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">try</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0"> {</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW28304209 BCX0"><span class="SCXW28304209 BCX0"> </span><br class="SCXW28304209 BCX0" /></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">    </span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">// Load the model using a URL</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW28304209 BCX0"><span class="SCXW28304209 BCX0"> </span><br class="SCXW28304209 BCX0" /></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">    </span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">const</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0"> model = </span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">await</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0"> tf.loadGraphModel(</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">`${modelPath}/model.json`</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW28304209 BCX0"><span class="SCXW28304209 BCX0"> </span><br class="SCXW28304209 BCX0" /></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">    </span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">// Warm up the model</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW28304209 BCX0"><span class="SCXW28304209 BCX0"> </span><br class="SCXW28304209 BCX0" /></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">    </span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">const</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0"> dummyInput = tf.ones(model.inputs[</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">0</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">].shape);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW28304209 BCX0"><span class="SCXW28304209 BCX0"> </span><br class="SCXW28304209 BCX0" /></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">    </span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">await</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0"> model.execute(dummyInput);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW28304209 BCX0"><span class="SCXW28304209 BCX0"> </span><br class="SCXW28304209 BCX0" /></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">    </span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">return</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0"> model;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW28304209 BCX0"><span class="SCXW28304209 BCX0"> </span><br class="SCXW28304209 BCX0" /></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">  } </span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">catch</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0"> (error) {</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW28304209 BCX0"><span class="SCXW28304209 BCX0"> </span><br class="SCXW28304209 BCX0" /></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">    </span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">throw</span></span> <span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">new</span></span> <span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">Error</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">(</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">`Failed to load model: ${error.message}`</span></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW28304209 BCX0"><span class="SCXW28304209 BCX0"> </span><br class="SCXW28304209 BCX0" /></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">  }</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW28304209 BCX0"><span class="SCXW28304209 BCX0"> </span><br class="SCXW28304209 BCX0" /></span><span class="TextRun Highlight SCXW28304209 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW28304209 BCX0">}</span></span><span class="EOP SCXW28304209 BCX0" data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span></pre>						</div>
				</div>
				<div class="elementor-element elementor-element-4fb7ba0 elementor-widget elementor-widget-heading" data-id="4fb7ba0" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<h4 class="elementor-heading-title elementor-size-default">3. Przygotowanie danych wejściowych</h4>		</div>
				</div>
				<div class="elementor-element elementor-element-bcd536f elementor-widget elementor-widget-text-editor" data-id="bcd536f" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Przed uruchomieniem modelu musimy odpowiednio przygotować obraz wejściowy. Modele YOLO oczekują obrazów o określonym rozmiarze, takim samym jaki został użyty podczas treningu sieci. Zamiast jednak zmieniać rozmiar obrazu (np. funkcją resize()), zalecamy bardziej zaawansowaną metodę przetwarzania obrazu, która zachowuje proporcje i stosuje wypełnienie (letterbox padding). Takie podejście jest zgodne z przetwarzaniem stosowanym przez Ultralytics podczas trenowania modelu YOLO i zapewni najlepszą skuteczność.</p><p>Poniższa funkcja skaluje obraz tak, aby największy jego wymiar zgadzał się z tym oczekiwanym przez model, dodaje wypełnienie aby dopasować drugi wymiar obrazu (jeżeli trzeba) i normalizuje obraz wejściowy:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-dd83945 elementor-widget elementor-widget-text-editor" data-id="dd83945" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">function</span></span> <span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">preprocessImage</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">(base64Image, imgSize) {</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> image = </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">new</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> Image();</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  image.src = base64Image;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> canvas = </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">document</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">.createElement(</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">'canvas'</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  canvas.width = image.width;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  canvas.height = image.height;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> ctx = canvas.getContext(</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">'2d'</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  ctx.drawImage(image, </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">0</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">, </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">0</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">, image.width, image.height);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">// Convert canvas image to a tensor</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">let</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> imgTensor = tf.browser.fromPixels(canvas);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">// Determine rescale factor</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> xFactor = image.width / imgSize;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> yFactor = image.height / imgSize;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> factor = </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">Math</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">.max(xFactor, yFactor);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> newWidth = </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">Math</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">.round(image.width / factor);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> newHeight = </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">Math</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">.round(image.height / factor);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">// Resize to expected input shape </span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  imgTensor = tf.image.resizeBilinear(imgTensor, [newHeight, newWidth]);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">// Add padding</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> xPad = (imgSize - newWidth) / </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">2</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> yPad = (imgSize - newHeight) / </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">2</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> top = </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">Math</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">.floor(yPad);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">co</span><span class="NormalTextRun SCXW147374849 BCX0">nst</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> bottom = </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">Math</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">.ceil(yPad);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> left = </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">Math</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">.floor(xPad);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">const</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> right = </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">Math</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">.ceil(xPad);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  imgTensor = tf.pad(imgTensor, [[top, bottom], [left, right], [</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">0</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">, </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">0</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">]], </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">114</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">// Normalize pixel values</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  imgTensor = imgTensor.div(</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">255.0</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">).expandDims(</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">0</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">); </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">// Add batch dimension</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">  </span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">return</span></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0"> { imgTensor, left, top, factor };</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW147374849 BCX0"><span class="SCXW147374849 BCX0"> </span><br class="SCXW147374849 BCX0" /></span><span class="TextRun Highlight SCXW147374849 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW147374849 BCX0">}</span></span><span class="EOP SCXW147374849 BCX0" data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span></pre>						</div>
				</div>
				<div class="elementor-element elementor-element-183b6cf elementor-widget elementor-widget-heading" data-id="183b6cf" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<h4 class="elementor-heading-title elementor-size-default">4. Uruchom inferencję modelu</h4>		</div>
				</div>
				<div class="elementor-element elementor-element-639b754 elementor-widget elementor-widget-text-editor" data-id="639b754" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Po załadowaniu modelu i przetworzeniu danych wejściowych, wykonanie inferencji odbywa się za pomocą tej linii kodu:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-25f3c6b elementor-widget elementor-widget-text-editor" data-id="25f3c6b" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre><span class="TextRun Highlight SCXW75192197 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW75192197 BCX0">const</span></span><span class="TextRun Highlight SCXW75192197 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW75192197 BCX0"> prediction = </span></span><span class="TextRun Highlight SCXW75192197 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW75192197 BCX0">await</span></span><span class="TextRun Highlight SCXW75192197 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW75192197 BCX0"> model.execute(inputTensor);</span></span><span class="EOP SCXW75192197 BCX0" data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span></pre>						</div>
				</div>
				<div class="elementor-element elementor-element-0830169 elementor-widget elementor-widget-heading" data-id="0830169" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<h4 class="elementor-heading-title elementor-size-default">5. Przetwarzanie wyników modelu</h4>		</div>
				</div>
				<div class="elementor-element elementor-element-aeca953 elementor-widget elementor-widget-text-editor" data-id="aeca953" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Wynik sieci YOLO to tensor, który należy odpowiednio zinterpretować. Poniżej znajdują się kroki w naszej funkcji <span style="color: #008000;">postprocessInferenceResults()</span>, które pozwalają na wyodrębnienie współrzędnych wszystkich wykrytych obiektów:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-04c9010 elementor-widget elementor-widget-text-editor" data-id="04c9010" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre data-ccp-border-bottom="0px none #000000" data-ccp-padding-bottom="0px" data-ccp-border-between="0px none #000000" data-ccp-padding-between="0px"><span data-contrast="none">const</span><span data-contrast="none"> results = prediction.transpose([</span><span data-contrast="none">0</span><span data-contrast="none">, </span><span data-contrast="none">2</span><span data-contrast="none">, </span><span data-contrast="none">1</span><span data-contrast="none">]); </span> <br /><span data-contrast="none">const</span><span data-contrast="none"> numClass = </span><span data-contrast="none">1</span><span data-contrast="none">; </span><span data-contrast="none">// Only one class in our case</span> <br /><span data-contrast="none">const</span><span data-contrast="none"> boxes = tf.tidy(() =&gt; {</span> <br /><span data-contrast="none">const</span><span data-contrast="none"> w = results.slice([</span><span data-contrast="none">0</span><span data-contrast="none">, </span><span data-contrast="none">0</span><span data-contrast="none">, </span><span data-contrast="none">2</span><span data-contrast="none">], [</span><span data-contrast="none">-1</span><span data-contrast="none">, </span><span data-contrast="none">-1</span><span data-contrast="none">, </span><span data-contrast="none">1</span><span data-contrast="none">]); </span><span data-contrast="none">// Get width</span> <br /><span data-contrast="none">const</span><span data-contrast="none"> h = results.slice([</span><span data-contrast="none">0</span><span data-contrast="none">, </span><span data-contrast="none">0</span><span data-contrast="none">, </span><span data-contrast="none">3</span><span data-contrast="none">], [</span><span data-contrast="none">-1</span><span data-contrast="none">, </span><span data-contrast="none">-1</span><span data-contrast="none">, </span><span data-contrast="none">1</span><span data-contrast="none">]); </span><span data-contrast="none">// Get height</span> <br /><span data-contrast="none">const</span><span data-contrast="none"> x1 = tf.sub(results.slice([</span><span data-contrast="none">0</span><span data-contrast="none">, </span><span data-contrast="none">0</span><span data-contrast="none">, </span><span data-contrast="none">0</span><span data-contrast="none">], [</span><span data-contrast="none">-1</span><span data-contrast="none">, </span><span data-contrast="none">-1</span><span data-contrast="none">, </span><span data-contrast="none">1</span><span data-contrast="none">]), tf.div(w, </span><span data-contrast="none">2</span><span data-contrast="none">)); </span><span data-contrast="none">// Get x1</span><span data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span><br /><br /><span data-contrast="none">const</span><span data-contrast="none"> y1 = tf.sub(results.slice([</span><span data-contrast="none">0</span><span data-contrast="none">, </span><span data-contrast="none">0</span><span data-contrast="none">, </span><span data-contrast="none">1</span><span data-contrast="none">], [</span><span data-contrast="none">-1</span><span data-contrast="none">, </span><span data-contrast="none">-1</span><span data-contrast="none">, </span><span data-contrast="none">1</span><span data-contrast="none">]), tf.div(h, </span><span data-contrast="none">2</span><span data-contrast="none">)); </span><span data-contrast="none">// Get y1</span> <br /><span data-contrast="none">return</span><span data-contrast="none"> tf.concat([y1, x1, y1.add(h), x1.add(w)], </span><span data-contrast="none">2</span><span data-contrast="none">).squeeze();</span> <br /><span data-contrast="none">});</span><span data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span></pre>						</div>
				</div>
				<div class="elementor-element elementor-element-70bdd06 elementor-widget elementor-widget-text-editor" data-id="70bdd06" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Aby wyodrębnić klasy i poziomy ufności dla każdego obiektu:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-4e859a7 elementor-widget elementor-widget-text-editor" data-id="4e859a7" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">const</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0"> numClass = labels.length;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW92870568 BCX0"><span class="SCXW92870568 BCX0"> </span><br class="SCXW92870568 BCX0" /></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">const</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0"> [scores, classes] = tf.tidy(() =&gt; {</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW92870568 BCX0"><span class="SCXW92870568 BCX0"> </span><br class="SCXW92870568 BCX0" /></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">const</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0"> rawData = results.slice([</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">0</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">, </span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">0</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">, </span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">4</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">], [</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">-1</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">, </span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">-1</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">, numClass]).squeeze(</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">0</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW92870568 BCX0"><span class="SCXW92870568 BCX0"> </span><br class="SCXW92870568 BCX0" /></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">  </span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">return</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0"> [rawData.max(</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">1</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">), rawData.argMax(</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">1</span></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">)];</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW92870568 BCX0"><span class="SCXW92870568 BCX0"> </span><br class="SCXW92870568 BCX0" /></span><span class="TextRun Highlight SCXW92870568 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW92870568 BCX0">});</span></span><span class="EOP SCXW92870568 BCX0" data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span></pre>						</div>
				</div>
				<div class="elementor-element elementor-element-c29f2bf elementor-widget elementor-widget-text-editor" data-id="c29f2bf" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Następnie należy pozbyć się wyników z poziomem ufności poniżej ustalonego progu (u nas był to 0.4):</p>						</div>
				</div>
				<div class="elementor-element elementor-element-2bbe314 elementor-widget elementor-widget-text-editor" data-id="2bbe314" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">const</span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0"> array = </span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">await</span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0"> scores.array();</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW227521811 BCX0"><span class="SCXW227521811 BCX0"> </span><br class="SCXW227521811 BCX0" /></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">const</span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0"> highConfidenceIndices = array.reduce((acc, value, index) =&gt; {</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW227521811 BCX0"><span class="SCXW227521811 BCX0"> </span><br class="SCXW227521811 BCX0" /></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">  </span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">if</span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0"> (value &gt; </span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">0.4</span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">) acc.push(index);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW227521811 BCX0"><span class="SCXW227521811 BCX0"> </span><br class="SCXW227521811 BCX0" /></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">  </span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">return</span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0"> acc;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW227521811 BCX0"><span class="SCXW227521811 BCX0"> </span><br class="SCXW227521811 BCX0" /></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">}, []);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW227521811 BCX0"><span class="SCXW227521811 BCX0"> </span><br class="SCXW227521811 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW227521811 BCX0"><span class="SCXW227521811 BCX0"> </span><br class="SCXW227521811 BCX0" /></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">const</span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0"> highConfidenceBoxes = boxes.gather(highConfidenceIndices);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW227521811 BCX0"><span class="SCXW227521811 BCX0"> </span><br class="SCXW227521811 BCX0" /></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">const</span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0"> highConfidenceScores = scores.gather(highConfidenceIndices);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW227521811 BCX0"><span class="SCXW227521811 BCX0"> </span><br class="SCXW227521811 BCX0" /></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0">const</span></span><span class="TextRun Highlight SCXW227521811 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW227521811 BCX0"> highConfidenceClasses = classes.gather(highConfidenceIndices);</span></span><span class="EOP SCXW227521811 BCX0" data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span></pre>						</div>
				</div>
				<div class="elementor-element elementor-element-6d455b0 elementor-widget elementor-widget-text-editor" data-id="6d455b0" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Na koniec zastosuj Non-Max Suppression (NMS), aby odfiltrować duplikaty, tzn. wykryte obiekty, które się na siebie nakładają:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-a51ed9c elementor-widget elementor-widget-text-editor" data-id="a51ed9c" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">const</span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0"> nms = </span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">await</span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0"> tf.image.nonMaxSuppressionAsync(highConfidenceBoxes, highConfidenceScores, </span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">40</span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">, </span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">0.45</span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">, </span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">0.4</span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">); </span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">// NMS to filter boxes</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW150352841 BCX0"><span class="SCXW150352841 BCX0"> </span><br class="SCXW150352841 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW150352841 BCX0"><span class="SCXW150352841 BCX0"> </span><br class="SCXW150352841 BCX0" /></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">const</span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0"> boxesData = highConfidenceBoxes.gather(nms, </span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">0</span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">); </span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">// Indexing boxes by NMS index</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW150352841 BCX0"><span class="SCXW150352841 BCX0"> </span><br class="SCXW150352841 BCX0" /></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">const</span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0"> scoresData = highConfidenceScores.gather(nms, </span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">0</span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">).dataSync(); </span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">// Indexing scores by</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW150352841 BCX0"><span class="SCXW150352841 BCX0"> </span><br class="SCXW150352841 BCX0" /></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">const</span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0"> classesData = highConfidenceClasses.gather(nms, </span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">0</span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">).dataSync(); </span></span><span class="TextRun Highlight SCXW150352841 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW150352841 BCX0">// Indexing classes by NMS index</span></span><span class="EOP SCXW150352841 BCX0" data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span></pre>						</div>
				</div>
				<div class="elementor-element elementor-element-a61bead elementor-widget elementor-widget-text-editor" data-id="a61bead" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Ostatnim krokiem jest przeskalowanie współrzędnych, aby dopasować je do kształtu oryginalnego obrazu:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-84b07f0 elementor-widget elementor-widget-text-editor" data-id="84b07f0" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">// Precompute the margins and factors outside the stack</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">const</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0"> yMarginTensor = tf.scalar(yMargin);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">const</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0"> xMarginTensor = tf.scalar(xMargin);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">const</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0"> resizeFactorTensor = tf.scalar(resizeFactor);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">// Slice the boxesData and apply transformations in one step</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">const</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0"> [yCoordinates, xCoordinates, height, width] = </span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">  [</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">'0'</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">, </span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">'1'</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">, </span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">'2'</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">, </span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">'3'</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">].map((index) =&gt; </span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">    boxesData.slice([</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">0</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">, </span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">parseInt</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">(index)], [</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">-1</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">, </span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">1</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">]).sub(index % </span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">2</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0"> === </span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">0</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0"> ? yMarginTensor : xMarginTensor).mul(resizeFactorTensor)</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">// Stack the tensors without converting to arrays (unless needed)</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">const</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0"> bbox = tf.stack([yCoordinates, xCoordinates, height, width], </span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">1</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">// Convert to an array only if absolutely necessary</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW260954935 BCX0"><span class="SCXW260954935 BCX0"> </span><br class="SCXW260954935 BCX0" /></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0">const</span></span><span class="TextRun Highlight SCXW260954935 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW260954935 BCX0"> bboxArray = bbox.arraySync();</span></span><span class="EOP SCXW260954935 BCX0" data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span></pre>						</div>
				</div>
				<div class="elementor-element elementor-element-b542632 elementor-widget elementor-widget-text-editor" data-id="b542632" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Na końcu możemy zdefiniować funkcję <strong>runInference()</strong>, która zawiera cały opisany powyżej proces wykrywania obiektów. Ta funkcja zawiera przygotowanie obrazu, uruchomienie inferencji modelu oraz przetworzenie wyników. Oto jak wygląda:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-d6642ff elementor-widget elementor-widget-text-editor" data-id="d6642ff" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">export</span></span> <span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">async</span></span> <span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">function</span></span> <span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">runInference</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">(model, labels, image, confidenceThreshold = </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">0.4</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">) {</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">  </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">try</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0"> {</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">    </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">// Preprocess the image</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">    </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">const</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0"> imgSize = model.inputs[</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">0</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">].shape[</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">1</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">];</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">    </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">const</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0"> { imgTensor: inputTensor, left: xMargin, top: yMargin, factor: resizeFactor } = preprocessImage(image, imgSize);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">    </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">// Run inference</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">    </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">const</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0"> prediction = </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">await</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0"> model.execute(inputTensor);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">    </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">// Post-process the model output</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">    </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">const</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0"> [boxes, scores, classes] = </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">await</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0"> postprocessInferenceResults(prediction, labels, xMargin, yMargin, resizeFactor, confidenceThreshold);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">    </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">return</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0"> [boxes, scores, classes];</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">  } </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">catch</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0"> (error) {</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">    </span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">throw</span></span> <span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">new</span></span> <span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">Error</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">(</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">`Inference failed: ${error.message}`</span></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">  }</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW217269171 BCX0"><span class="SCXW217269171 BCX0"> </span><br class="SCXW217269171 BCX0" /></span><span class="TextRun Highlight SCXW217269171 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW217269171 BCX0">}</span></span><span class="EOP SCXW217269171 BCX0" data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span></pre>						</div>
				</div>
				<div class="elementor-element elementor-element-d087385 elementor-widget elementor-widget-heading" data-id="d087385" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<h4 class="elementor-heading-title elementor-size-default">6. Wizualizacja wyników </h4>		</div>
				</div>
				<div class="elementor-element elementor-element-84689b0 elementor-widget elementor-widget-text-editor" data-id="84689b0" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Na samym końcu, gdy mamy już gotowe wyniki detekcji, możemy narysować wykryte obiekty na obrazie:</p>						</div>
				</div>
				<div class="elementor-element elementor-element-d769790 elementor-widget elementor-widget-text-editor" data-id="d769790" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<pre><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">function</span></span> <span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">drawBoxesOnCanvas</span></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">(ctx, boxes, classes, scores, colors) {</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW6384134 BCX0"><span class="SCXW6384134 BCX0"> </span><br class="SCXW6384134 BCX0" /></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">  boxes.forEach((box, i) =&gt; {</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW6384134 BCX0"><span class="SCXW6384134 BCX0"> </span><br class="SCXW6384134 BCX0" /></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">    </span></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">const</span></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0"> [x1, y1, x2, y2] = box;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW6384134 BCX0"><span class="SCXW6384134 BCX0"> </span><br class="SCXW6384134 BCX0" /></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">    ctx.strokeStyle = colors[classes[i]];</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW6384134 BCX0"><span class="SCXW6384134 BCX0"> </span><br class="SCXW6384134 BCX0" /></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">    ctx.lineWidth = </span></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">2</span></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">;</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW6384134 BCX0"><span class="SCXW6384134 BCX0"> </span><br class="SCXW6384134 BCX0" /></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">    ctx.strokeRect(x1, y1, x2 - x1, y2 - y1);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW6384134 BCX0"><span class="SCXW6384134 BCX0"> </span><br class="SCXW6384134 BCX0" /></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">    ctx.fillStyle = colors[classes[i]];</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW6384134 BCX0"><span class="SCXW6384134 BCX0"> </span><br class="SCXW6384134 BCX0" /></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">    ctx.fillText(</span></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">`${labels[classes[i]]} (${</span></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">Math</span></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">.round(scores[i] * </span></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">100</span></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">)}%)`</span></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">, x1, y1);</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW6384134 BCX0"><span class="SCXW6384134 BCX0"> </span><br class="SCXW6384134 BCX0" /></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">  });</span></span><span class="LineBreakBlob BlobObject DragDrop SCXW6384134 BCX0"><span class="SCXW6384134 BCX0"> </span><br class="SCXW6384134 BCX0" /></span><span class="TextRun Highlight SCXW6384134 BCX0" lang="PL" xml:lang="PL" data-contrast="none"><span class="NormalTextRun SCXW6384134 BCX0">}</span></span><span class="EOP SCXW6384134 BCX0" data-ccp-props="{&quot;134245417&quot;:false,&quot;201341983&quot;:0,&quot;335559740&quot;:360,&quot;335572071&quot;:0,&quot;335572072&quot;:0,&quot;335572073&quot;:0,&quot;335572075&quot;:0,&quot;335572076&quot;:0,&quot;335572077&quot;:0,&quot;335572079&quot;:0,&quot;335572080&quot;:0,&quot;335572081&quot;:0,&quot;335572083&quot;:0,&quot;335572084&quot;:0,&quot;335572085&quot;:0,&quot;335572087&quot;:0,&quot;335572088&quot;:0,&quot;335572089&quot;:0,&quot;469789798&quot;:&quot;nil&quot;,&quot;469789802&quot;:&quot;nil&quot;,&quot;469789806&quot;:&quot;nil&quot;,&quot;469789810&quot;:&quot;nil&quot;,&quot;469789814&quot;:&quot;nil&quot;}"> </span></pre>						</div>
				</div>
				<div class="elementor-element elementor-element-0a7536b elementor-widget elementor-widget-text-editor" data-id="0a7536b" data-element_type="widget" data-widget_type="text-editor.default">
				<div class="elementor-widget-container">
							<p>Podsumowując, uruchamianie modelu YOLO do wykrywania obiektów bezpośrednio w przeglądarce przy użyciu TensorFlow.js otwiera nowe możliwości dla aplikacji real-time. W tym wpisie przedstawiliśmy wszystkie kroki, od konfiguracji TensorFlow.js, przez ładowanie modeli, przetwarzanie obrazów, uruchamianie wnioskowania, aż po wizualizację wyników, wraz ze wskazówkami jak zrobić to efektywnie. W miarę dalszego zgłębiania tej ciekawej technologii, warto eksperymentować z różnymi modelami, technikami optymalizacji oraz przypadkami użycia, aby w pełni wykorzystać potencjał uczenia maszynowego w aplikacjach internetowych.</p>						</div>
				</div>
		<div class="elementor-element elementor-element-b23a8f8 e-grid e-con-full e-con e-child" data-id="b23a8f8" data-element_type="container">
				<div class="elementor-element elementor-element-2e189c2 elementor-widget elementor-widget-heading" data-id="2e189c2" data-element_type="widget" data-widget_type="heading.default">
				<div class="elementor-widget-container">
			<h4 class="elementor-heading-title elementor-size-default">Zapraszam do kontaktu, jeśli masz pytania lub chciałbyś podzielić się swoimi implementacjami!</h4>		</div>
				</div>
				<div class="elementor-element elementor-element-a749555 elementor-button-success elementor-align-center elementor-widget elementor-widget-button" data-id="a749555" data-element_type="widget" data-widget_type="button.default">
				<div class="elementor-widget-container">
							<div class="elementor-button-wrapper">
					<a class="elementor-button elementor-button-link elementor-size-sm" href="https://inero-software.com/pl/kontakt/">
						<span class="elementor-button-content-wrapper">
						<span class="elementor-button-icon">
				<svg aria-hidden="true" class="e-font-icon-svg e-fas-envelope" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M502.3 190.8c3.9-3.1 9.7-.2 9.7 4.7V400c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V195.6c0-5 5.7-7.8 9.7-4.7 22.4 17.4 52.1 39.5 154.1 113.6 21.1 15.4 56.7 47.8 92.2 47.6 35.7.3 72-32.8 92.3-47.6 102-74.1 131.6-96.3 154-113.7zM256 320c23.2.4 56.6-29.2 73.4-41.4 132.7-96.3 142.8-104.7 173.4-128.7 5.8-4.5 9.2-11.5 9.2-18.9v-19c0-26.5-21.5-48-48-48H48C21.5 64 0 85.5 0 112v19c0 7.4 3.4 14.3 9.2 18.9 30.6 23.9 40.7 32.4 173.4 128.7 16.8 12.2 50.2 41.8 73.4 41.4z"></path></svg>			</span>
									<span class="elementor-button-text">KONTAKT</span>
					</span>
					</a>
				</div>
						</div>
				</div>
				</div>
				</div>
		<div class="elementor-element elementor-element-38cdd54 e-con-full e-flex e-con e-child" data-id="38cdd54" data-element_type="container">
				</div>
					</div>
				</div>
				</div>
		<p>Artykuł <a href="https://inero-software.com/pl/sieci-neuronowe-w-przegladarce-przewodnik-na-przykladzie-customowej-sieci-yolo-do-wykrywania-twarzy/">Sieci neuronowe w przeglądarce: Przewodnik na przykładzie customowej sieci YOLO do wykrywania twarzy</a> pochodzi z serwisu <a href="https://inero-software.com/pl">Inero Software - Rozwiązania IT i Konsulting</a>.</p>
]]></content:encoded>
					
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">6230</post-id>	</item>
		<item>
		<title>Zarządzanie danymi za pomocą uczenia maszynowego</title>
		<link>https://inero-software.com/pl/optymalizacja-procesow-biznesowych/</link>
		
		<dc:creator><![CDATA[Andrzej Chybicki]]></dc:creator>
		<pubDate>Mon, 07 Mar 2022 15:29:39 +0000</pubDate>
				<category><![CDATA[Blog_pl]]></category>
		<category><![CDATA[Firma]]></category>
		<category><![CDATA[Technologie]]></category>
		<category><![CDATA[optymalizacja procesów biznesowych]]></category>
		<category><![CDATA[sztuczna inteligencja]]></category>
		<category><![CDATA[uczenie maszynowe]]></category>
		<category><![CDATA[zarządzanie danymi]]></category>
		<guid isPermaLink="false">https://inero-software.com/?p=4335</guid>

					<description><![CDATA[<p>Wraz z rewolucją Industry 4.0 produkcja zautomatyzowała się. Mamy więcej automatycznych urządzeń i pomiarów, przez co obsługujemy większą ilość danych. Stają się one siłą napędową produkcji przemysłowej i obejmują wszystkie jej aspekty. Dane mogą dotyczyć produktów, sprzętu, badań, łańcucha dostaw, finansów czy użytkowników. </p>
<p>Artykuł <a href="https://inero-software.com/pl/optymalizacja-procesow-biznesowych/">Zarządzanie danymi za pomocą uczenia maszynowego</a> pochodzi z serwisu <a href="https://inero-software.com/pl">Inero Software - Rozwiązania IT i Konsulting</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p>&nbsp;</p>
<div class="row">
<p><div class="col-sm-1"></div></p>
<p><div class="col-sm-10">
<p>&nbsp;</p>
<h2 aria-level="1"><span style="color: #800080;" data-contrast="none">Ogromne ilości danych w życiu biznesowym</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559738&quot;:240,&quot;335559739&quot;:0,&quot;335559740&quot;:259}"> </span></h2>
<p>&nbsp;</p>
<p><span data-contrast="auto"><span class="TextRun SCXW189727610 BCX0" lang="EN-US" xml:lang="EN-US" data-contrast="auto"><span class="NormalTextRun SCXW189727610 BCX0"><span class="TextRun SCXW21457896 BCX0" lang="EN-US" xml:lang="EN-US" data-contrast="auto"><span class="NormalTextRun SCXW21457896 BCX0"><img loading="lazy" decoding="async" class=" wp-image-2768 alignleft" src="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08.png" alt="" width="92" height="92" srcset="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08.png 208w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08-80x80.png 80w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08-50x50.png 50w" sizes="(max-width: 92px) 100vw, 92px" /></span></span></span></span>W ostatnich latach rewolucja Przemysł 4.0 (Industry 4.0) wprowadziła powszechną automatyzację i digitalizację produkcji. Skutkuje to wprowadzaniem automatyzacji w procesie decyzyjnym oraz produkcyjnym, wdrażaniem nowych urządzeń i pomiarów, a w efekcie dostępem do większej liczby danych pomiarowych oraz biznesowych dotyczących procesu produkcji. Urządzenia oraz dane stają się siłą napędową produkcji przemysłowej i obejmują wszystkie jej aspekty, mogą dotyczyć produktów, sprzętu, badań, <a href="https://inero-software.com/pl/zarzadzanie-lancuchem-dostaw/">łańcucha dostaw</a>, finansów czy nawet użytkowników.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></p>
<p><span data-contrast="auto">Dzięki odpowiedniemu przepływowi danych, moduły wchodzące w skład procesu produkcyjnego pozwalają na jego dostosowanie do bieżących potrzeb wynikających z bieżącego portfela zamówień, jakości surowców, terminów dostaw oraz innych. W ten sposób każda część linii produkcyjnej staje się w pewnym sensie modyfikowalnym zasobem, przez co przedsiębiorstwo może pozwolić sobie na spersonalizowaną produkcję odzwierciedlając i przewidując potrzeby konsumentów. </span><b><span data-contrast="auto">Tworzy się więc odpowiedni cykl produktowy: produkcja -&gt; sprzedaż -&gt; informacja zwrotna.</span></b><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></p>
<p><span data-contrast="auto">Ilość, złożoność danych oraz wzajemne powiązania pomiędzy nimi sprawiają, że interpretacja i przyjmowanie ich wykracza poza ludzkie możliwości. Przy złożonym procesie produkcyjnym niezwykle trudno jest szybko i z dużą dozą prawdopodobieństwa określić, wpływ poszczególnych komponentów na ostateczną wydajność i jakoś produkcji. To samo tyczy się jakości towarów, jeżeli szybkość ich produkcji jest na naprawdę wysokim poziomie. Wykorzystując zintegrowane procesy przetwarzania danych możemy podzielić moduły na różne narzędzia, takie jak systemy transmisji danych, systemy do pozyskiwania danych czy systemy sprzężenia zwrotnego danych. Chcąc korzystać z mechanizmów z technologii IT i uczenia maszynowego należy zamodelować proces produkcji tak, aby poddać go szczegółowej analizie.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></p>
<p>&nbsp;</p>
<h2 aria-level="2"><span style="color: #800080;">Optymalizacja procesów biznesowych </span></h2>
<p>&nbsp;</p>
<p><span data-contrast="auto"><span class="TextRun SCXW153317933 BCX0" lang="EN-US" xml:lang="EN-US" data-contrast="auto"><span class="NormalTextRun SCXW153317933 BCX0"><span class="TextRun SCXW189727610 BCX0" lang="EN-US" xml:lang="EN-US" data-contrast="auto"><span class="NormalTextRun SCXW189727610 BCX0"><span class="TextRun SCXW21457896 BCX0" lang="EN-US" xml:lang="EN-US" data-contrast="auto"><span class="NormalTextRun SCXW21457896 BCX0"><img loading="lazy" decoding="async" class="wp-image-2768 size-thumbnail alignleft" src="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08-80x80.png" alt="Paragrapgh icon" width="80" height="80" srcset="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08-80x80.png 80w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08-50x50.png 50w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08.png 208w" sizes="(max-width: 80px) 100vw, 80px" /></span></span></span></span></span></span>Jednak same dane nie wystarczą. </span><b><span data-contrast="auto">Ważne jest, aby z danych wydobywać cenne informacje i wiedzę.</span></b><span data-contrast="auto"> Właśnie tym zajmuje się <a href="https://inero-software.com/pl/uczenie-maszynowe/">Machine Learning</a>. Pozwala on ocenić trendy, zależności pomiędzy danymi, powiązania między danymi mierzonymi a innymi danymi z różnych procesów czy przewidywać wydarzenia na podstawie tego co było. Dzisiejsze zakłady produkcyjne stają się coraz bardziej złożone z wzajemnie powiązanymi procesami. Człowiek w takich sytuacjach szybko osiąga granicę swoich możliwości, aby uwzględnić każdy aspekt procesu. Machine Learning oferuje skuteczne rozwiązanie, które pokonuje wcześniej wymienione wyzwania.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></p>
<blockquote><p><span style="color: #800080;"><i>&#8222;Machine Learning to obecnie najważniejsza technologia dla biznesu. Dzieje się tak, ponieważ oprogramowanie oparte na sztucznej inteligencji już teraz pomaga firmom zwiększać wydajność, poprawiać relacje z klientami i zwiększać sprzedaż.</i>&#8222;</span></p>
<p>~Według McKinsey&#8217;a</p></blockquote>
<p><span data-contrast="auto">Trzeba pamiętać o tym, że nie wystarczy mieć dane i po prostu je łączyć. Jeżeli zależy nam na wydobyciu informacji z danych, trzeba przeprowadzić proces ich ekstrakcji, usunąć zbędne zależności, wyczyścić błędy grube, zrozumieć istniejące zależności oraz opracować i dopasować model ML, który będzie odwzorował dane, a na końcu przystosować go do działania w trybie produkcyjnym.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></p>
<p>&nbsp;</p>
<h2 aria-level="2"><span style="color: #800080;">Obszary działania Machine Learning </span></h2>
<p>&nbsp;</p>
<p><span data-contrast="auto">Głównym celem algorytmów <a href="https://inero-software.com/pl/uczenie-maszynowe/">Sztucznej Inteligencji</a> jest rozwiązywanie konkretnych problemów oraz ulepszanie procesów. Machine Learning pozwala zoptymalizować takie obszary, jak:</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></p>
<ul>
<li data-leveltext="" data-font="Symbol" data-listid="3" aria-setsize="-1" data-aria-posinset="1" data-aria-level="1"><span data-contrast="auto">Automatyzacja procesów</span><span data-ccp-props="{&quot;134233279&quot;:true,&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></li>
<li data-leveltext="" data-font="Symbol" data-listid="3" aria-setsize="-1" data-aria-posinset="2" data-aria-level="1"><span data-contrast="auto">Bezpieczeństwo pracy</span><span data-ccp-props="{&quot;134233279&quot;:true,&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></li>
<li data-leveltext="" data-font="Symbol" data-listid="3" aria-setsize="-1" data-aria-posinset="3" data-aria-level="1"><span data-contrast="auto">Kontrola jakości</span><span data-ccp-props="{&quot;134233279&quot;:true,&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></li>
</ul>
<p><span data-contrast="auto">Warto wspomnieć o tym, że algorytmy pozwalają rozwiązywać problemy z różnych sfer biznesowych. Konieczne jest więc biznesowe ustalenie, po co proces wdrażania narzędzi Machine Learning ma być realizowany. </span><b><span data-contrast="auto">Należy się także nastawić się na to, że wdrażanie ML to proces, a nie zadanie</span></b><span data-contrast="auto">. Wdrożenie algorytmów uczenia maszynowego wymaga stale generowanych danych, aby można było odpowiednio sterować procesami produkcyjnymi. Dlatego wszystkie aspekty takich procesów muszą zostać zdigitalizowane w jak największym stopniu. Wymaga to więc od ekspertów zaprojektowania procesów uwzględniających aktualny stan danych, dzięki czemu będzie można świadomie zbierać prawidłowe dane i optymalizować odpowiednie metryki. </span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></p>
<blockquote><p><span style="color: #800080;"><i>&#8222;McKinsey przewiduje, ze Machine Learning pomoże firmom produkcyjnym skrócić czas dostawy materiałów o 30% oraz osiągnąć 12% oszczędności paliwa dzięki optymalizacji ich procesów. Firma szacuje również, że przedsiębiorstwa mogą zwiększyć przychody brutto o 13%, jeśli w pełni zintegrują w swojej działalności technologie oparte na sztucznej inteligencji.&#8221;</i></span></p></blockquote>
<p><span data-contrast="auto">Algorytmy oparte na uczeniu maszynowym mogą działać w czasie rzeczywistym, dzięki czemu będą one dostarczać konkretne rekomendacje, jeżeli zidentyfikują one potencjał poprawy produkcji. Machine Learning może służyć więc jako narzędzie wsparcia dla operatorów kontrolujących proces, pomagając im podejmować bardziej świadome decyzje w celu maksymalizacji produkcji w swoim przedsiębiorstwie.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></p>
<p>Wdrażając rozwiązania z obszaru uczenia maszynowego musimy zbudować odpowiednią strategię zgodną z celami naszego przedsiębiorstwa. Poprzez zdefiniowanie jasnych celów i zrozumieniu wymaganej infrastruktury możemy liczyć na większe prawdopodobieństwo sukcesu wprowadzanych rozwiązań. Dodatkowo trzeba pamiętać o tym, że dane muszą być odpowiednio sformatowane oraz uporządkowane pod kątem algorytmu.</p>
<p>Jeśli chcemy w pełni wykorzystać możliwości jakie daje uczenie maszynowe, w naszej organizacji potrzebujemy zarówno odpowiedniego zespołu ekspertów, specjalistów ML oraz odpowiedniego nastawienia ukierunkowanego na realizację celów.</p>
<p>Na bazię zdobytych doświadczeń,  <strong>Zespół Inero Software, określił metodykę wdrożeń rozwiązań opartych o technologie AI/ML, którą można streścić w kilku następujących krokach: </strong></p>
<ol>
<li data-leveltext="%1." data-font="" data-listid="2" aria-setsize="-1" data-aria-posinset="1" data-aria-level="1"><span data-contrast="auto">Identyfikacja problemów i celów biznesowych &#8211; jest to kluczowe przy próbie zrozumienia danej infrastruktury.</span></li>
<li data-leveltext="%1." data-font="" data-listid="2" aria-setsize="-1" data-aria-posinset="1" data-aria-level="1"><span data-contrast="auto">Ustalenie źródeł danych i ich jakości &#8211; im lepszej jakości danymi będziemy dysponować, tym skuteczniejszy algorytm uczenia maszynowego będzie.</span></li>
<li data-leveltext="%1." data-font="" data-listid="2" aria-setsize="-1" data-aria-posinset="1" data-aria-level="1"><span data-contrast="auto">Zebranie danych i ich przystosowanie</span><span data-ccp-props="{&quot;134233279&quot;:true,&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> &#8211; dostosowanie danych i ich uporządkowanie również pozytywnie wpłynie na działanie algorytmu.</span></li>
<li data-leveltext="%1." data-font="" data-listid="2" aria-setsize="-1" data-aria-posinset="1" data-aria-level="1"><span data-contrast="auto">Stworzenie efektywnego modelu na podstawie punktów 1-3.</span></li>
<li data-leveltext="%1." data-font="" data-listid="2" aria-setsize="-1" data-aria-posinset="1" data-aria-level="1"><span data-contrast="auto">Uruchomienie i weryfikacja algorytmu w kontekście założonych przez nas celów.</span></li>
<li data-leveltext="%1." data-font="" data-listid="2" aria-setsize="-1" data-aria-posinset="1" data-aria-level="1"><span data-contrast="auto">Ustanowienie wąskich gardeł, gdzie mamy braki danych &#8211; sprawdzamy więc jakie dane są źle zbierane i wyciągamy z tego wnioski.</span></li>
</ol>
<p>W ten sposób otrzymujemy efektywny model, który skutecznie analizuje dane i dostarcza nam dokładne wyniki. Oczywiście budowanie takiego modelu to proces ciągły, dlatego warto co jakiś czas powtarzać powyższe kroki, aby jeszcze bardziej usprawnić nasz algorytm.</p>
<p>&nbsp;</p>
<h2 aria-level="2"><span style="color: #800080;">Efektywne zarządzanie przedsiębiorstwem dzięki optymalizacji procesów biznesowych</span></h2>
<p>&nbsp;</p>
<p><b><span data-contrast="auto"><span class="TextRun SCXW153317933 BCX0" lang="EN-US" xml:lang="EN-US" data-contrast="auto"><span class="NormalTextRun SCXW153317933 BCX0"><span class="TextRun SCXW189727610 BCX0" lang="EN-US" xml:lang="EN-US" data-contrast="auto"><span class="NormalTextRun SCXW189727610 BCX0"><span class="TextRun SCXW21457896 BCX0" lang="EN-US" xml:lang="EN-US" data-contrast="auto"><span class="NormalTextRun SCXW21457896 BCX0"><img loading="lazy" decoding="async" class="alignleft wp-image-2768 " src="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08.png" alt="Paragrapgh icon" width="169" height="169" srcset="https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08.png 208w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08-80x80.png 80w, https://inero-software.com/wp-content/uploads/2019/05/inero-glify-08-50x50.png 50w" sizes="(max-width: 169px) 100vw, 169px" /></span></span></span></span></span></span>Ważne jest zrozumienie, że Machine Learning to nie jest złoty środek na rozwiązanie wszystkich problemów</span></b><span data-contrast="auto">. ML to narzędzie, które pozwala w sposób efektywny wykorzystać dane do zarządzania i optymalizacji procesów. Wiele branż obecnie skupia się na digitalizacji oraz analityce. W niektórych przedsiębiorstwach każdego dnia gromadzą się ogromne ilości danych. Natomiast algorytmy uczenia maszynowego mogą tak naprawdę zbierać nieograniczoną liczbę danych. Optymalizacja wykonywana przez ekspertów w dużej mierze opiera się na ich doświadczeniu. Machine Learning polega na uczeniu się na podstawie wcześniejszych doświadczeń. Analizując więc takie ilości danych, algorytmy mogą nauczyć się rozumieć złożone relacje pomiędzy różnymi partnerami oraz ich wpływ na produkcję. To, jak sztuczna inteligencja uczy się z doświadczenia przypomina w pewien sposób ekspertów, którzy uczą się sterować danym procesem. Jednak AI pozwala na analizowanie pełnych zbiorów danych na przestrzeni kilku lat.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></p>
<p><span data-contrast="auto">Istotna w tej kwestii jest współpraca <a href="https://inero-software.com/pl/nasze-uslugi/">ekspertów od Machine Learning</a> i ekspertów biznesowych, aby ML odzwierciedlał procesy biznesowe. Liczy się tutaj z jednej strony dobre sprecyzowanie potrzeb biznesu ergo i optymalizacja ML pod to, co chcemy osiągnąć. Z drugiej strony ważne jest, żeby eksperci biznesowi rozumieli ograniczenia i wady Machine Learning. Złe dane spowodują, że wnioski w efekcie zaszkodzą procesowi.</span><span data-ccp-props="{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}"> </span></p>
<p><a href="https://inero-software.com/pl/"><span style="color: #800080;"><strong>Inero Software</strong></span></a> oferuje wiedzę i doświadczenie w zakresie skutecznego wykorzystywania najnowocześniejszych technologii i danych do kształtowania korporacyjnych produktów cyfrowych przyszłości.</p>
<p>W sekcji <a href="https://inero-software.com/pl/category/firma/"><span style="color: #800080;"><strong>BLOG</strong></span></a> można znaleźć inne artykuły dotyczące nowoczesnych rozwiązań dla przedsiębiorstw.</p>
<p>&nbsp;</p>
<p></p></div><br />
</p></div>
<p>Artykuł <a href="https://inero-software.com/pl/optymalizacja-procesow-biznesowych/">Zarządzanie danymi za pomocą uczenia maszynowego</a> pochodzi z serwisu <a href="https://inero-software.com/pl">Inero Software - Rozwiązania IT i Konsulting</a>.</p>
]]></content:encoded>
					
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">4335</post-id>	</item>
	</channel>
</rss>
