はじめに
音声読み上げ(WebSpeechAPI)を使って、百人一首の読み上げサイトが作れるのではないか、と思いついてReact+TypeScriptで作ってみました。
startボタンを押すと読み上げが始まります。
実行例
See the Pen Untitled by kalz2q (@kalz2q) on CodePen.
解説
読み上げはwindows.speechSynthesisと言うのを使っています。あまりナチュラルな日本語に聞こえないけど頑張っている!
とりあえず百人一首に聞こえるものね。
音声の頭が欠けるのを防ぐために、「ん。」を出だしに入れているので不要な人はエディターで一括削除して下さい。
一枚読み上げるのに8秒かかるので、intervalを8000にしたところ、startを押しても8秒経たないと始まらないのをどうにかしたいが、方法が思いつかない。
最近の作品の中では一番の大作です。 百人一首のデータだけでも使い道があるかもしれない。