質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

4回答

4647閲覧

WebAudioAPIでピッチシフトさせるためのコードについて(JavaScript初心者)

退会済みユーザー

退会済みユーザー

総合スコア0

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2017/07/12 08:47

WebAudioAPIでピッチシフトをさせるためにScriptProcessorNodeを使って実装させようと思ってます。ピッチを二倍するためには波形を再生速度を0.5倍にして0.5倍縮小したらいいらしいのですがどのようなコードにすればいいか模索して行き詰まっています。

「サウンドプログラミング入門」青木直史(著)のピッチシフトの部分を参考にしていますが本がC言語なので書き方があっているかわかりません。
http://floor13.sakura.ne.jp/book06/book06.html

JavaScript

1 PichShift.setup = function(audioStream) { 2 console.log("PichShift setup"); 3 var processor = audioCtx.createScriptProcessor(1024, 2, 2); 4 this.output = audioCtx.createMediaStreamDestination(); 5 this.mic = audioCtx.createMediaStreamSource(audioStream); 6 this.mic.connect(processor); 7 processor.connect(this.output); 8 processor.onaudioprocess = function(event) { 9 // Get the instance of Float32Array for output data (Array size equals buffer size) 10 var outputLs = event.outputBuffer.getChannelData(0); // Left channel 11 var outputRs = event.outputBuffer.getChannelData(1); // Right channel 12 var pich = 2.0; 13 var n = 128; 14 for (var i = 0; i < 1024; i++) { 15 // Fundamental period 16 var t = pich*i; 17 for(int m = t - n / 2; m <= t + n ; m ++){ 18 if(m >= 0 && m < 1024){ 19 outputLs[i] += outputRs[i] * Math.sin(Math.PI*(t - m)) * (0.5 + 0.5 * Math.cos(2.0 * Math.PI * (t - m) / (n * 2 + 1))); 20 } 21 } 22 var output = 0; 23 24 // Output sound 25 outputLs[i] = output; 26 outputRs[i] = output; 27 // Update phase 28 } 29 }; 30 31}

これをindex.htmlで呼んでいますがエラーで動きません。
JavaScript初心者なので根本的なメソッドの書き方が違うかもしれません。
アドバイスよろしくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答4

0

ベストアンサー

おそらくこんな感じのコードになるかと ...

JavaScript

1const context = new AudioContext(); 2const processor = context.createScriptProcessor(1024, 2, 2); 3 4navigator.mediaDevices.getUserMedia({ audio : true }).then((stream) => { 5 const mediaStream = context.createMediaStreamSource(stream); 6 7 mediaStream.connect(processor); 8 processor.connect(context.destination); 9 10 processor.onaudioprocess = (event) => { 11 const inputLs = event.inputBuffer.getChannelData(0); 12 const inputRs = event.inputBuffer.getChannelData(1); 13 const outputLs = event.outputBuffer.getChannelData(0); 14 const outputRs = event.outputBuffer.getChannelData(1); 15 16 for (let i = 0; i < 1024; i++) { 17 const outputLs = /* ピッチシフターのアルゴリズム */; 18 const outputRs = /* ピッチシフターのアルゴリズム */; 19 20 outputLs[i] = outputL; // ピッチシフターが適用された音声データ 21 outputRs[i] = outputR; // ピッチシフターが適用された音声データ 22 } 23 }; 24}).catch((error) => { 25 console.error(error); 26});

投稿2017/07/12 10:05

編集2017/07/12 20:46
Korilakkuma

総合スコア29

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2017/07/13 01:53

エラーはindex.htmlで呼ぶ部分でReferenceError: PichShift is not definedとでます。 pichshift.jsというファイルの中でPichShift.setupというメソッドを作ってその中に書いていただいたコードを書いたのですがエラーになります。processor.onaudioprocessの部分をコメントアウトすると実行できます。 https://github.com/hiroeAbe/mediaStreamMerging4/blob/master/mediaStreamMerging-master/pichshift.js 私のgithubです。もしよければ見て指摘していただけると嬉しいです。
退会済みユーザー

退会済みユーザー

2017/07/13 04:33

エラー消えました!ありがとうございます。ピッチシフトのアルゴリズムが違うのかまだ音のはあまり変化がないですが試行錯誤してみます。
guest

0

ああ ... 違う. 書籍の URL ですね ... やはり エラー内容を教えていただいてもよろしいでしょうか ?

投稿2017/07/12 09:52

Korilakkuma

総合スコア29

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

すみません ... URL がありましたね. 確認してみます.

投稿2017/07/12 09:51

Korilakkuma

総合スコア29

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

エラーの内容を教えていただいてもよろしいでしょうか ?

投稿2017/07/12 09:50

Korilakkuma

総合スコア29

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問