show code
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@2.0.0/dist/tf.min.js"></script>
</head>
<video width=300 height=300></video>
<p></p>
<img width=300 height=300 />
<script>
const video = document.querySelector('video')
const image = document.querySelector('img')
const status = document.querySelector("p")
const canvas = document.createElement('canvas')
const ctx = canvas.getContext('2d')
let model
main()
async function main () {
status.innerText = "Model loading..."
const MODEL_URL = 'http://xxxxx/test/web_graph_model2/model.json'
console.log(2222)
model = await tf.loadGraphModel(MODEL_URL)
console.log(model)
status.innerText = "Model is loaded!"
const stream = await navigator.mediaDevices.getUserMedia({ video: true })
video.srcObject = stream
await video.play()
canvas.width = video.videoWidth
canvas.height = video.videoHeight
refresh()
}
async function refresh(){
ctx.drawImage(video, 0,0)
image.src = canvas.toDataURL('image/png')
await model.load()
console.log(model)
const tensor = tf.browser.fromPixels(image);
console.log(tensor)
const predictions = await model.executeAsync(tf.cast(tensor.expandDims(0), "float32"))
const res = predictions.dataSync()
console.log(predictions)
console.log(res)
if (res)
status.innerHTML = res
setTimeout(refresh, 100)
}
</script>
</html>
