今天一樣只有code
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>命令(指定的語音)辨識</title>
<!-- TensorFlow.js Core -->
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs/dist/tf.min.js">
</script>
<!-- TensorFlow.js speech-commands-->
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/speech-commands"></script>
</script>
</head>
<body>
<ul id="command">
</ul>
<script>
let command_list_dom_cache = [];
function listAllCommand(command_array) {
let command_list = document.getElementById('command');
command_array.map((element, i) => {
let command_dom = document.createElement('li');
command_dom.innerHTML = element;
command_list.appendChild(command_dom);
command_list_dom_cache[i] = command_dom;
});
}
function showCommand(scores) {
let high_score = 0;
scores.map((score, i) => {
command_list_dom_cache[i].score = score;
if (score > high_score) high_score = score;
})
command_list_dom_cache.map((element) => {
element.style.color = "black";
if (element.score >= high_score) {
element.style.color = "red";
}
})
}
//need to allow third-party cookies
async function app() {
//use FFT in browser
let recognizer = speechCommands.create('BROWSER_FFT');
//await for model loading
await recognizer.ensureModelLoaded();
//read all exist word label
const commands = recognizer.wordLabels();
//write to command list
listAllCommand(commands);
recognizer.listen(result => {
showCommand(result.scores)
}, {
probabilityThreshold: 0.9
})
}
app();
</script>
</body>
</html>