HTML5講座2回
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
単語検索
|
最終更新
|
ヘルプ
]
開始行:
第2回では
HTML5でTTS(Text To Speech)をやってみたいと思います。
Text To Speechとはテキストを音声合成で読みあげる機能のこ...
ゆっくりボイスで有名なSofTalkやJulius APIとかが有名です。
HTML5ではWeb Speech APIというものを使うことで
ブラウザ機能で読み上げることができるようになりました
今回使う全ソースコードは次からダウンロードできます。
&ref(tts.html);
speakボタンでローマ字入力した日本語をしゃべります。
&ref(tts.png);
全ソースコードは以下となります
<!DOCTYPE html>
<!-- saved from url=(0065)http://html5-examples.craic.co...
<html><head><meta http-equiv="Content-Type" content="tex...
<title>Web speech API によるText to Speech</title>
<script type="text/javascript">
var voices = [];
window.onload=function() {
voices = window.speechSynthesis.getVoices();
for(var i = 0; i < voices.length; i++ ) {
console.log("Voice " + i.toString() + ' ' + v...
}
};
function speak() {
var u = new SpeechSynthesisUtterance();
u.lang = 'ja-JP';
u.text = document.getElementById('text').value; /...
// u.pitch = 1;
// u.rate = 1;
// u.volume = 1;
speechSynthesis.speak(u);
}
</script>
</head>
<body>
<h2>Text to Speech</h2>
<input type="text" id="text" value="konnnichiwa"/><br/>
<input type="button" id="tts" value="Speak" onClick="sp...
</body>
</html>
注意点はローマ字入力でないと日本語がしゃべれないというこ...
後、いまんとこ声のバリエーションがありません。
ちゃんとした日本語しゃべらせたいよーという人は
日本語→ローマ字変換するYahooのWeb APIが用意されています
(1日のリクエスト回数に上限はありますが)
http://developer.yahoo.co.jp/webapi/jlp/furigana/v1/furig...
興味がある人はチャレンジしてみてください。
#vote(○[0],△[0],×[0])
終了行:
第2回では
HTML5でTTS(Text To Speech)をやってみたいと思います。
Text To Speechとはテキストを音声合成で読みあげる機能のこ...
ゆっくりボイスで有名なSofTalkやJulius APIとかが有名です。
HTML5ではWeb Speech APIというものを使うことで
ブラウザ機能で読み上げることができるようになりました
今回使う全ソースコードは次からダウンロードできます。
&ref(tts.html);
speakボタンでローマ字入力した日本語をしゃべります。
&ref(tts.png);
全ソースコードは以下となります
<!DOCTYPE html>
<!-- saved from url=(0065)http://html5-examples.craic.co...
<html><head><meta http-equiv="Content-Type" content="tex...
<title>Web speech API によるText to Speech</title>
<script type="text/javascript">
var voices = [];
window.onload=function() {
voices = window.speechSynthesis.getVoices();
for(var i = 0; i < voices.length; i++ ) {
console.log("Voice " + i.toString() + ' ' + v...
}
};
function speak() {
var u = new SpeechSynthesisUtterance();
u.lang = 'ja-JP';
u.text = document.getElementById('text').value; /...
// u.pitch = 1;
// u.rate = 1;
// u.volume = 1;
speechSynthesis.speak(u);
}
</script>
</head>
<body>
<h2>Text to Speech</h2>
<input type="text" id="text" value="konnnichiwa"/><br/>
<input type="button" id="tts" value="Speak" onClick="sp...
</body>
</html>
注意点はローマ字入力でないと日本語がしゃべれないというこ...
後、いまんとこ声のバリエーションがありません。
ちゃんとした日本語しゃべらせたいよーという人は
日本語→ローマ字変換するYahooのWeb APIが用意されています
(1日のリクエスト回数に上限はありますが)
http://developer.yahoo.co.jp/webapi/jlp/furigana/v1/furig...
興味がある人はチャレンジしてみてください。
#vote(○[0],△[0],×[0])
ページ名: