Browser Object Detection with Transformers.js – AI Code Example
CODE PREVIEW
エディタを読み込み中…
P
Prompt
Create a single HTML file that demonstrates real-time object detection using Transformers.js in the browser. The page should load a pre-trained model (e.g., 'Xenova/detr-resnet-50') and run inference on an image selected by the user via a file input. Display the image with bounding boxes and labels drawn on a canvas overlay. Use minimal dependencies (only Transformers.js CDN). Style with a modern, dark theme.
このデモはTransformers.jsを使ってDETR-ResNet-50物体検出モデルをブラウザで直接実行します。サーバーやGPUは不要、すべての推論はクライアントサイドのWebAssemblyで動作。画像を選択すると、モデルがバウンディングボックスとラベル・確信度を描画します。コードは最小限で、Transformers.jsのCDNのみを使用し、ダークテーマでスタイルされています。
Prompt Overview
This demo uses Transformers.js to run the DETR-ResNet-50 object detection model directly in the browser. No server or GPU is required; all inference runs on client-side WebAssembly. When you select an image, the model draws bounding boxes along with labels and confidence scores. The code is minimal, using only the Transformers.js CDN, and is styled with a dark theme.
Was this prompt helpful?
Comments
Comments appear after moderation
この記事が役に立ったら投げ銭で応援
Apple Pay / Google Pay / カード (Visa/Mastercard/JCB/Amex) / Link / Alipay / WeChat Pay 対応 · Stripeで安全に決済
開発者が選ぶ最強ツール集
運営者が毎日使っているツール・ガジェット 6選