bwhsu/example2

1 2<!DOCTYPE html>3<html lang="en">4<head>5  <meta charset="UTF-8" />6  <title>MNIST 網頁辨識</title>7  <link rel="stylesheet" href="style.css" />8  <script src="https://cdn.jsdelivr.net/npm/onnxruntime-web/dist/ort.min.js"></script>9</head>10<body>11  <h1>📷 即時手寫數字辨識（MNIST）</h1>12  <video id="video" width="224" height="224" autoplay></video>13  <br />14  <p>🎨 處理後影像（28x28 灰階）</p>15  <canvas id="processed" width="28" height="28" style="border:1px solid #ccc"></canvas>16  <p>🔍 預測結果：<span id="result">-</span></p>17  <script src="script.js"></script>18</body>19</html>20