From 6ef1fa4618e08426b874529619a66adbd3d1fcf0 Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 12:07:59 +0100 Subject: unslug ja: move --- .../api/baseaudiocontext/createanalyser/index.html | 154 ++++++++++++++++ .../baseaudiocontext/createbiquadfilter/index.html | 126 +++++++++++++ .../api/baseaudiocontext/createbuffer/index.html | 174 ++++++++++++++++++ .../baseaudiocontext/createbuffersource/index.html | 143 +++++++++++++++ .../createchannelmerger/index.html | 133 ++++++++++++++ .../createchannelsplitter/index.html | 133 ++++++++++++++ .../baseaudiocontext/createconvolver/index.html | 131 ++++++++++++++ .../api/baseaudiocontext/createdelay/index.html | 143 +++++++++++++++ .../createdynamicscompressor/index.html | 138 ++++++++++++++ .../web/api/baseaudiocontext/creategain/index.html | 128 +++++++++++++ .../baseaudiocontext/createoscillator/index.html | 111 ++++++++++++ .../api/baseaudiocontext/createpanner/index.html | 198 +++++++++++++++++++++ .../baseaudiocontext/createperiodicwave/index.html | 139 +++++++++++++++ .../createscriptprocessor/index.html | 69 +++++++ .../baseaudiocontext/createstereopanner/index.html | 128 +++++++++++++ .../api/baseaudiocontext/currenttime/index.html | 112 ++++++++++++ .../baseaudiocontext/decodeaudiodata/index.html | 155 ++++++++++++++++ .../api/baseaudiocontext/destination/index.html | 114 ++++++++++++ .../web/api/baseaudiocontext/listener/index.html | 112 ++++++++++++ .../api/baseaudiocontext/onstatechange/index.html | 101 +++++++++++ .../web/api/baseaudiocontext/samplerate/index.html | 112 ++++++++++++ files/ja/web/api/baseaudiocontext/state/index.html | 66 +++++++ 22 files changed, 2820 insertions(+) create mode 100644 files/ja/web/api/baseaudiocontext/createanalyser/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createbiquadfilter/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createbuffer/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createbuffersource/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createchannelmerger/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createchannelsplitter/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createconvolver/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createdelay/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createdynamicscompressor/index.html create mode 100644 files/ja/web/api/baseaudiocontext/creategain/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createoscillator/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createpanner/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createperiodicwave/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createscriptprocessor/index.html create mode 100644 files/ja/web/api/baseaudiocontext/createstereopanner/index.html create mode 100644 files/ja/web/api/baseaudiocontext/currenttime/index.html create mode 100644 files/ja/web/api/baseaudiocontext/decodeaudiodata/index.html create mode 100644 files/ja/web/api/baseaudiocontext/destination/index.html create mode 100644 files/ja/web/api/baseaudiocontext/listener/index.html create mode 100644 files/ja/web/api/baseaudiocontext/onstatechange/index.html create mode 100644 files/ja/web/api/baseaudiocontext/samplerate/index.html create mode 100644 files/ja/web/api/baseaudiocontext/state/index.html (limited to 'files/ja/web/api/baseaudiocontext') diff --git a/files/ja/web/api/baseaudiocontext/createanalyser/index.html b/files/ja/web/api/baseaudiocontext/createanalyser/index.html new file mode 100644 index 0000000000..c186d1029c --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createanalyser/index.html @@ -0,0 +1,154 @@ +--- +title: AudioContext.createAnalyser() +slug: Web/API/AudioContext/createAnalyser +translation_of: Web/API/BaseAudioContext/createAnalyser +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのcreateAnalyser()メソッドは、音声の時間と周波数を解析する{{ domxref("AnalyserNode") }}を生成します。これはデータの可視化などで使えます。

+
+ +
+

注: このノードの詳しい説明は、{{domxref("AnalyserNode")}}のページを参照してください。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var analyser = audioCtx.createAnalyser();
+ +

戻り値

+ +

{{domxref("AnalyserNode")}}

+ +

+ +

次のサンプルでは、基本的なAudioContextAnalyserNodeの生成、requestAnimationFrame()による時間データの周期的な収集と「オシロスコープのように」現在の音声を出力する方法を示しています。より完全な例と情報は、Voice-change-O-maticデモ(app.jsの128–205行目)を参照してください。

+ +
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+var analyser = audioCtx.createAnalyser();
+
+  ...
+
+analyser.fftSize = 2048;
+var bufferLength = analyser.fftSize;
+var dataArray = new Uint8Array(bufferLength);
+analyser.getByteTimeDomainData(dataArray);
+
+// 現在の音のオシロスコープのように描く
+
+function draw() {
+
+      drawVisual = requestAnimationFrame(draw);
+
+      analyser.getByteTimeDomainData(dataArray);
+
+      canvasCtx.fillStyle = 'rgb(200, 200, 200)';
+      canvasCtx.fillRect(0, 0, WIDTH, HEIGHT);
+
+      canvasCtx.lineWidth = 2;
+      canvasCtx.strokeStyle = 'rgb(0, 0, 0)';
+
+      canvasCtx.beginPath();
+
+      var sliceWidth = WIDTH * 1.0 / bufferLength;
+      var x = 0;
+
+      for(var i = 0; i < bufferLength; i++) {
+
+        var v = dataArray[i] / 128.0;
+        var y = v * HEIGHT/2;
+
+        if(i === 0) {
+          canvasCtx.moveTo(x, y);
+        } else {
+          canvasCtx.lineTo(x, y);
+        }
+
+        x += sliceWidth;
+      }
+
+      canvasCtx.lineTo(canvas.width, canvas.height/2);
+      canvasCtx.stroke();
+    };
+
+    draw();
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createAnalyser-AnalyserNode', 'createAnalyser()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/createbiquadfilter/index.html b/files/ja/web/api/baseaudiocontext/createbiquadfilter/index.html new file mode 100644 index 0000000000..136557bea5 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createbiquadfilter/index.html @@ -0,0 +1,126 @@ +--- +title: AudioContext.createBiquadFilter() +slug: Web/API/AudioContext/createBiquadFilter +translation_of: Web/API/BaseAudioContext/createBiquadFilter +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのcreateBiquadFilter()メソッドはいくつかの一般的なフィルタを設定できる二次フィルターを表す{{ domxref("BiquadFilterNode") }}を生成します。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var biquadFilter = audioCtx.createBiquadFilter();
+ +

戻り値

+ +

{{domxref("BiquadFilterNode")}}

+ +

+ +

次の例はAudioContextのBiquadFilterNodeの使い方を説明しています。完全に動作する例は、voice-change-o-maticデモ(ソースコードもあります)を参照してください。

+ +
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+
+// このアプリで使う2つのノードを設定する
+var analyser = audioCtx.createAnalyser();
+var distortion = audioCtx.createWaveShaper();
+var gainNode = audioCtx.createGain();
+var biquadFilter = audioCtx.createBiquadFilter();
+var convolver = audioCtx.createConvolver();
+
+// ノードを接続する
+
+source = audioCtx.createMediaStreamSource(stream);
+source.connect(analyser);
+analyser.connect(distortion);
+distortion.connect(biquadFilter);
+biquadFilter.connect(convolver);
+convolver.connect(gainNode);
+gainNode.connect(audioCtx.destination);
+
+// 二次フィルターで操作する
+
+biquadFilter.type = "lowshelf";
+biquadFilter.frequency.value = 1000;
+biquadFilter.gain.value = 25;
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createBiquadFilter-BiquadFilterNode', 'createBiquadFilter()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0 {{property_prefix("webkit")}}
+ 22
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参照

+ + diff --git a/files/ja/web/api/baseaudiocontext/createbuffer/index.html b/files/ja/web/api/baseaudiocontext/createbuffer/index.html new file mode 100644 index 0000000000..e94a5a18be --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createbuffer/index.html @@ -0,0 +1,174 @@ +--- +title: AudioContext.createBuffer() +slug: Web/API/AudioContext/createBuffer +translation_of: Web/API/BaseAudioContext/createBuffer +--- +

{{ APIRef("Web Audio API") }}

+ +
+

インターフェースのcreateBuffer()メソッドは、新規の空の{{ domxref("AudioBuffer") }}オブジェクトを生成します。そこにデータを書きこめば、{{ domxref("AudioBufferSourceNode") }}で再生できます。

+
+ +
+

Note: createBuffer() used to be able to take compressed data and give back decoded samples, but this ability was removed from the spec, because all the decoding was done on the main thread, therefore createBuffer() was blocking other code execution. The asynchronous method decodeAudioData() does the same thing — takes compressed audio, say, an MP3 file, and directly gives you back an {{ domxref("AudioBuffer") }} that you can then set to play via in an {{ domxref("AudioBufferSourceNode") }}. For simple uses like playing an MP3, decodeAudioData() is what you should be using.

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var buffer = audioCtx.createBuffer(numOfChannels, length, sampleRate);
+ +

引数

+ +
+

Note: For an in-depth explanation of how audio buffers work, and what these parameters mean, read Audio buffers: frames, samples and channels from our Basic concepts guide.

+
+ +
+
numOfChannels
+
integerで現されたバッファのチャンネルの数。実装は少なくとも32チャンネルに対応している
+
length
+
integerで表されたバッファのサンプルフレームの数
+
sampleRate
+
1秒あたりのサンプルフレームの数。実装は少なくとも22050から96000の範囲に対応している
+
+ +

戻り値

+ +

{{domxref("AudioBuffer")}}

+ +

+ +

まずは2つの小さな例で、引数をどのように設定するかを説明します:

+ +
var audioCtx = new AudioContext();
+var buffer = audioCtx.createBuffer(2, 22050, 44100);
+ +

このようにすると、ステレオ(2チャンネル)のバッファが生成され、44100Hz(極めて一般的で、多くの通常のサウンドカードはこのレートで動作します)のAudioContextで再生すると、0.5秒間(22050フレーム / 44100Hz )となります。

+ +
var audioCtx = new AudioContext();
+var buffer = audioCtx.createBuffer(1, 22050, 22050);
+ +

このようにすると、モノラル(1チャンネル)のバッファが生成され、44100HzのAudioContextで再生すると、自動的に44100Hzに再サンプリングされ(そして結果として44100フレームとなり)、1秒間(44100フレーム / 44100Hz)となります。

+ +
+

Note: audio resampling is very similar to image resizing: say you've got a 16 x 16 image, but you want it to fill a 32x32 area: you resize (resample) it. the result has less quality (it can be blurry or edgy, depending on the resizing algorithm), but it works, and the resized image takes up less space. Resampled audio is exactly the same — you save space, but in practice you will be unable to properly reproduce high frequency content (treble sound).

+
+ +

次は少し複雑なcreateBuffer()の例を見てみましょう。2秒間のバッファを生成し、ホワイトノイズを書き込み、{{ domxref("AudioBufferSourceNode") }}で再生します。コードをすぐに実行することや、ソースコードを閲覧することもできます。

+ +
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+var button = document.querySelector('button');
+var pre = document.querySelector('pre');
+var myScript = document.querySelector('script');
+
+pre.innerHTML = myScript.innerHTML;
+
+// ステレオ
+var channels = 2;
+// AudioContextのサンプルレートで2秒間の空のステレオバッファを生成する
+var frameCount = audioCtx.sampleRate * 2.0;
+
+var myArrayBuffer = audioCtx.createBuffer(channels, frameCount, audioCtx.sampleRate);
+
+button.onclick = function() {
+  // バッファにホワイトノイズを書き込む;
+  // 単なる-1.0から1.0の間の乱数の値である
+  for (var channel = 0; channel < channels; channel++) {
+   // 実際のデータの配列を得る
+   var nowBuffering = myArrayBuffer.getChannelData(channel);
+   for (var i = 0; i < frameCount; i++) {
+     // Math.random()は[0; 1.0]である
+     // 音声は[-1.0; 1.0]である必要がある
+     nowBuffering[i] = Math.random() * 2 - 1;
+   }
+  }
+
+  // AudioBufferSourceNodeを得る
+  // これはAudioBufferを再生するときに使うAudioNodeである
+  var source = audioCtx.createBufferSource();
+  // AudioBufferSourceNodeにバッファを設定する
+  source.buffer = myArrayBuffer;
+  // AudioBufferSourceNodeを出力先に接続すると音声が聞こえるようになる
+  source.connect(audioCtx.destination);
+  // 音源の再生を始める
+  source.start();
+}
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createBuffer-AudioBuffer-unsigned-long-numberOfChannels-unsigned-long-length-float-sampleRate', 'createBuffer()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0 {{property_prefix("webkit")}}
+ 22
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/createbuffersource/index.html b/files/ja/web/api/baseaudiocontext/createbuffersource/index.html new file mode 100644 index 0000000000..24f65061c6 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createbuffersource/index.html @@ -0,0 +1,143 @@ +--- +title: AudioContext.createBufferSource() +slug: Web/API/AudioContext/createBufferSource +translation_of: Web/API/BaseAudioContext/createBufferSource +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのcreateBufferSource()メソッドは、{{ domxref("AudioBuffer") }}オブジェクトに書き込まれた音声データを再生する{{ domxref("AudioBufferSourceNode") }}を生成します。{{ domxref("AudioBuffer") }}は{{domxref("AudioContext.createBuffer")}}を使った場合や、{{domxref("AudioContext.decodeAudioData")}}でオーディオトラックをデコードしたときに生成されます。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var source = audioCtx.createBufferSource();
+ +

戻り値

+ +

{{domxref("AudioBufferSourceNode")}}

+ +

+ +

この例では、2秒間のバッファを生成し、ホワイトノイズを書き込み、{{ domxref("AudioBufferSourceNode") }}で再生します。コメントは何をしているかを簡単に説明しています。

+ +
+

注: コードの実行ソースの閲覧もできます。

+
+ +
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+var button = document.querySelector('button');
+var pre = document.querySelector('pre');
+var myScript = document.querySelector('script');
+
+pre.innerHTML = myScript.innerHTML;
+
+// ステレオ
+var channels = 2;
+// AudioContextのサンプルレートで2秒間の空のステレオバッファを生成する
+var frameCount = audioCtx.sampleRate * 2.0;
+
+var myArrayBuffer = audioCtx.createBuffer(2, frameCount, audioCtx.sampleRate);
+
+button.onclick = function() {
+  // バッファにホワイトノイズを書き込む;
+  // 単なる-1.0から1.0の間の乱数の値である
+  for (var channel = 0; channel < channels; channel++) {
+   // 実際のデータの配列を得る
+   var nowBuffering = myArrayBuffer.getChannelData(channel);
+   for (var i = 0; i < frameCount; i++) {
+     // Math.random()は[0; 1.0]である
+     // 音声は[-1.0; 1.0]である必要がある
+     nowBuffering[i] = Math.random() * 2 - 1;
+   }
+  }
+
+  // AudioBufferSourceNodeを得る
+  // これはAudioBufferを再生するときに使うAudioNodeである
+  var source = audioCtx.createBufferSource();
+  // AudioBufferSourceNodeにバッファを設定する
+  source.buffer = myArrayBuffer;
+  // AudioBufferSourceNodeを出力先に接続すると音声が聞こえるようになる
+  source.connect(audioCtx.destination);
+  // 音源の再生を始める
+  source.start();
+}
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createBufferSource-AudioBufferSourceNode', 'createBufferSource()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/createchannelmerger/index.html b/files/ja/web/api/baseaudiocontext/createchannelmerger/index.html new file mode 100644 index 0000000000..e79b116642 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createchannelmerger/index.html @@ -0,0 +1,133 @@ +--- +title: AudioContext.createChannelMerger() +slug: Web/API/AudioContext/createChannelMerger +translation_of: Web/API/BaseAudioContext/createChannelMerger +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのcreateChannelMerger()メソッドは、複数のオーディオストリームを1つに混合する{{domxref("ChannelMergerNode")}}を生成します。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var merger = audioCtx.createChannelMerger(numberOfInputs);
+ +

引数

+ +
+
numberOfInputs
+
入力オーディオストリームのチャンネルの数。指定がない場合は6になる。
+
+ +

戻り値

+ +

{{domxref("ChannelMergerNode")}}

+ +

+ +

この例ではステレオトラックを分け、左右のチャンネルをそれぞれ別に処理する方法を示しています。これを使うためには、{{domxref("AudioNode.connect(AudioNode)") }}メソッドの2番目と3番目の引数を使い、接続元と接続先のチャンネルの番号を指定する必要があります。

+ +
var ac = new AudioContext();
+ac.decodeAudioData(someStereoBuffer, function(data) {
+ var source = ac.createBufferSource();
+ source.buffer = data;
+ var splitter = ac.createChannelSplitter(2);
+ source.connect(splitter);
+ var merger = ac.createChannelMerger(2);
+
+ // 左チャンネルのボリュームのみ小さくする
+ var gain = ac.createGain();
+ gain.value = 0.5;
+ splitter.connect(gain, 0);
+
+ // splitterをmergerの2番目の入力にして戻す
+ // ここではチャンネルを入れ替えることで、ステレオ音声の左右を逆にしている
+ gain.connect(merger, 0, 1);
+ splitter.connect(merger, 1, 0);
+
+ var dest = ac.createMediaStreamDestination();
+
+ // ChannelMergerNodeを使ったのでステレオのMediaStreamとなった
+ // webオーディオグラフのWebRTCやMediaRecorderなどに渡す
+ merger.connect(dest);
+});
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createChannelMerger-ChannelMergerNode-unsigned-long-numberOfInputs', 'createChannelMerger()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参照

+ + diff --git a/files/ja/web/api/baseaudiocontext/createchannelsplitter/index.html b/files/ja/web/api/baseaudiocontext/createchannelsplitter/index.html new file mode 100644 index 0000000000..07444c49d0 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createchannelsplitter/index.html @@ -0,0 +1,133 @@ +--- +title: AudioContext.createChannelSplitter() +slug: Web/API/AudioContext/createChannelSplitter +translation_of: Web/API/BaseAudioContext/createChannelSplitter +--- +

{{ APIRef("Web Audio API") }}

+ +
+

インターフェースのcreateChannelSplitter()メソッドは、オーディオストリームを個別に処理するためにチャンネルを分離する{{domxref("ChannelSplitterNode")}}を生成します。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var splitter = audioCtx.createChannelSplitter(numberOfOutputs);
+ +

引数

+ +
+
numberOfOutputs
+
入力オーディオストリームを分ける数。引数の指定がなければ6。
+
+ +

Returns

+ +

{{domxref("ChannelSplitterNode")}}

+ +

+ +

この例ではステレオトラックを分け、左右のチャンネルをそれぞれ別に処理する方法を示しています。これを使うためには、{{domxref("AudioNode.connect(AudioNode)") }}メソッドの2番目と3番目の引数を使い、接続元と接続先のチャンネルの番号を指定する必要があります。

+ +
var ac = new AudioContext();
+ac.decodeAudioData(someStereoBuffer, function(data) {
+ var source = ac.createBufferSource();
+ source.buffer = data;
+ var splitter = ac.createChannelSplitter(2);
+ source.connect(splitter);
+ var merger = ac.createChannelMerger(2);
+
+ // 左チャンネルのボリュームのみ小さくする
+ var gain = ac.createGain();
+ gain.value = 0.5;
+ splitter.connect(gain, 0);
+
+ // splitterをmergerの2番目の入力にして戻す
+ // ここではチャンネルを入れ替えることで、ステレオ音声の左右を逆にしている
+ gain.connect(merger, 0, 1);
+ splitter.connect(merger, 1, 0);
+
+ var dest = ac.createMediaStreamDestination();
+
+ // ChannelMergerNodeを使ったのでステレオのMediaStreamとなった
+ // webオーディオグラフのWebRTCやMediaRecorderなどに渡す
+ merger.connect(dest);
+});
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createChannelSplitter-ChannelSplitterNode-unsigned-long-numberOfOutputs', 'createChannelSplitter()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/createconvolver/index.html b/files/ja/web/api/baseaudiocontext/createconvolver/index.html new file mode 100644 index 0000000000..ae5acf59c8 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createconvolver/index.html @@ -0,0 +1,131 @@ +--- +title: AudioContext.createConvolver() +slug: Web/API/AudioContext/createConvolver +translation_of: Web/API/BaseAudioContext/createConvolver +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのcreateConvolver()メソッドは、音声にリバーブ効果などを適用する{{ domxref("ConvolverNode") }}を生成します。詳細はspec definition of Convolutionを参照してください。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var convolver = audioCtx.createConvolver();
+ +

戻り値

+ +

{{domxref("ConvolverNode")}}

+ +

+ +

次の例は畳み込みノードを生成する基礎的なAudioContextの使い方を示しています。まず、畳み込み(インパルス応答)が適用される音声が書き込まれたAudioBufferを生成し、そしてそれに畳み込みを適用します。例ではコンサートホールの群集の短い音声を使っていて、深く音響したリバーブ効果がかかっています。

+ +

例と情報の応用は、Voice-change-O-maticデモ(ソースコード)をチェックしてください。

+ +
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+var convolver = audioCtx.createConvolver();
+
+  ...
+
+// XHRで畳み込みノードのための音声トラックを得る
+
+var soundSource, concertHallBuffer;
+
+ajaxRequest = new XMLHttpRequest();
+ajaxRequest.open('GET', 'concert-crowd.ogg', true);
+ajaxRequest.responseType = 'arraybuffer';
+
+ajaxRequest.onload = function() {
+  var audioData = ajaxRequest.response;
+  audioCtx.decodeAudioData(audioData, function(buffer) {
+      concertHallBuffer = buffer;
+      soundSource = audioCtx.createBufferSource();
+      soundSource.buffer = concertHallBuffer;
+    }, function(e){"Error with decoding audio data" + e.err});
+}
+
+ajaxRequest.send();
+
+  ...
+
+convolver.buffer = concertHallBuffer;
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createConvolver-ConvolverNode', 'createConvolver()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/createdelay/index.html b/files/ja/web/api/baseaudiocontext/createdelay/index.html new file mode 100644 index 0000000000..709a8a375b --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createdelay/index.html @@ -0,0 +1,143 @@ +--- +title: AudioContext.createDelay() +slug: Web/API/AudioContext/createDelay +translation_of: Web/API/BaseAudioContext/createDelay +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのcreateDelay()メソッドは、入力音声信号を一定時間遅らせる{{domxref("DelayNode")}}を生成します。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var synthDelay = audioCtx.createDelay(maxDelayTime);
+ +

引数

+ +
+
maxDelayTime
+
音声信号の最大遅れ時間の秒数。デフォルトは0
+
+ +

戻り値

+ +

{{domxref("DelayNode")}}

+ +

+ +

ループする3つの異なる簡単な例を用意しました。create-delayを見てください。(ソースコードも閲覧できます。)ただPlayボタンを押すと、ループはすぐ始まります。スライダーを右に動かしPlayボタンを押すと、待ち時間が挿入され、少し時間が過ぎるまで再生が始まりません。

+ +
var AudioContext = window.AudioContext || window.webkitAudioContext;
+var audioCtx = new AudioContext();
+
+var synthDelay = audioCtx.createDelay(5.0);
+
+  ...
+
+var synthSource;
+
+playSynth.onclick = function() {
+  synthSource = audioCtx.createBufferSource();
+  synthSource.buffer = buffers[2];
+  synthSource.loop = true;
+  synthSource.start();
+  synthSource.connect(synthDelay);
+  synthDelay.connect(destination);
+  this.setAttribute('disabled', 'disabled');
+}
+
+stopSynth.onclick = function() {
+  synthSource.disconnect(synthDelay);
+  synthDelay.disconnect(destination);
+  synthSource.stop();
+  playSynth.removeAttribute('disabled');
+}
+
+...
+
+var delay1;
+rangeSynth.oninput = function() {
+delay1 = rangeSynth.value;
+synthDelay.delayTime.value = delay1;
+}
+
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createDelay-DelayNode-double-maxDelayTime', 'createDelay()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参照

+ + diff --git a/files/ja/web/api/baseaudiocontext/createdynamicscompressor/index.html b/files/ja/web/api/baseaudiocontext/createdynamicscompressor/index.html new file mode 100644 index 0000000000..2fa5ca43ed --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createdynamicscompressor/index.html @@ -0,0 +1,138 @@ +--- +title: AudioContext.createDynamicsCompressor() +slug: Web/API/AudioContext/createDynamicsCompressor +translation_of: Web/API/BaseAudioContext/createDynamicsCompressor +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのcreateDynamicsCompressor()メソッドは、音声信号にコンプレッサーを適用する{{domxref("DynamicsCompressorNode")}}を生成します。

+
+ +

コンプレッサーは、音声信号の最大部分の音量を小さくし、最小部分の音量を大きくします。一般的に、より大きく、豊かで、高密度な音になります。これはゲームや音楽アプリケーションでたくさんの別々の音を同時に再生する場合に特に重要です。このような場合、全体の音量の操作したり、出力音声のクリッピング(ひずみ)を避けたいはずです。

+ +

構文

+ +
var audioCtx = new AudioContext();
+var compressor = audioCtx.createDynamicsCompressor();
+ +

戻り値

+ +

{{domxref("DynamicsCompressorNode")}}

+ +

+ +

音声トラックにコンプレッサーを追加するためにcreateDynamicsCompressor()を使う簡単なデモコードです。より完全なサンプルは、basic Compressor example (ソースコードの閲覧)を参照してください。

+ +
// MediaElementAudioSourceNodeを生成する
+// そこにHTMLMediaElementを入れる
+var source = audioCtx.createMediaElementSource(myAudio);
+
+// コンプレッサーノードを生成する
+var compressor = audioCtx.createDynamicsCompressor();
+compressor.threshold.value = -50;
+compressor.knee.value = 40;
+compressor.ratio.value = 12;
+compressor.reduction.value = -20;
+compressor.attack.value = 0;
+compressor.release.value = 0.25;
+
+// AudioBufferSourceNodeを行き先(destination)につなげる
+source.connect(audioCtx.destination);
+
+button.onclick = function() {
+  var active = button.getAttribute('data-active');
+  if(active == 'false') {
+    button.setAttribute('data-active', 'true');
+    button.innerHTML = 'Remove compression';
+
+    source.disconnect(audioCtx.destination);
+    source.connect(compressor);
+    compressor.connect(audioCtx.destination);
+  } else if(active == 'true') {
+    button.setAttribute('data-active', 'false');
+    button.innerHTML = 'Add compression';
+
+    source.disconnect(compressor);
+    compressor.disconnect(audioCtx.destination);
+    source.connect(audioCtx.destination);
+  }
+}
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createDynamicsCompressor-DynamicsCompressorNode', 'createDynamicsCompressor()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/creategain/index.html b/files/ja/web/api/baseaudiocontext/creategain/index.html new file mode 100644 index 0000000000..c536a0621c --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/creategain/index.html @@ -0,0 +1,128 @@ +--- +title: AudioContext.createGain() +slug: Web/API/AudioContext/createGain +translation_of: Web/API/BaseAudioContext/createGain +--- +

{{ APIRef("Web Audio API") }}

+ +
+

インターフェースのcreateGain()メソッドは、音声の全体的なボリュームを操作する{{ domxref("GainNode") }}を生成します。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var gainNode = audioCtx.createGain();
+ +

戻り値

+ +

{{domxref("GainNode")}}

+ +

+ +

次の例では{{domxref("AudioContext")}}、GainNodeを生成する基本的な使い方を示しています。生成したGainNodeは、Muteボタンを押したときにgainプロパティの値を設定することで、無音・無音解除するために使っています。完全な例と情報は、Voice-change-O-maticデモ(ソースの閲覧)をクリックしてください。

+ +
<div>
+  <a class="mute">Mute button</a>
+</div>
+ +
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+var gainNode = audioCtx.createGain();
+var mute = document.querySelector('.mute');
+
+source.connect(gainNode);
+gainNode.connect(audioCtx.destination);
+
+  ...
+
+mute.onclick = voiceMute;
+
+function voiceMute() {
+  if(mute.id == "") {
+    gainNode.gain.value = 0;
+    mute.id = "activated";
+    mute.innerHTML = "Unmute";
+  } else {
+    gainNode.gain.value = 1;
+    mute.id = "";
+    mute.innerHTML = "Mute";
+  }
+}
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createGain-GainNode', 'createGain()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/createoscillator/index.html b/files/ja/web/api/baseaudiocontext/createoscillator/index.html new file mode 100644 index 0000000000..e971400f5d --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createoscillator/index.html @@ -0,0 +1,111 @@ +--- +title: AudioContext.createOscillator() +slug: Web/API/AudioContext/createOscillator +translation_of: Web/API/BaseAudioContext/createOscillator +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのcreateOscillator()メソッドは、周期的な波形を発生源である{{ domxref("OscillatorNode") }}を生成します。これは基礎的な音源です。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var oscillator = audioCtx.createOscillator();
+ +

戻り値

+ +

{{domxref("OscillatorNode")}}

+ +

+ +

次の例はオシレーターノードを生成する基礎的なAudioContextの使い方を示しています。例と情報の応用は、Voice-change-O-maticデモ(ソースコード)をチェックしてください。また、{{ domxref("OscillatorNode") }}にはより詳細な情報があります。

+ +
// webオーディオAPIコンテキストを生成する
+var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+
+// オシレーターノードを生成する
+var oscillator = audioCtx.createOscillator();
+
+oscillator.type = 'square';
+oscillator.frequency.value = 3000; // 値はHz(ヘルツ)
+oscillator.start();
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createOscillator-OscillatorNode', 'createOscillator')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/createpanner/index.html b/files/ja/web/api/baseaudiocontext/createpanner/index.html new file mode 100644 index 0000000000..1b30c60a03 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createpanner/index.html @@ -0,0 +1,198 @@ +--- +title: AudioContext.createPanner() +slug: Web/API/AudioContext/createPanner +translation_of: Web/API/BaseAudioContext/createPanner +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }} の createPanner() を利用すると、新しい {{domxref("PannerNode")}} を作成できます。これは空間音響を実現するために利用されます。

+ +

作成された PannerNode は、音声の聴取者の位置と向きから空間的な再生を行います。聴取者の位置と向きは、 {{domxref("AudioListener") }} オブジェクトとして表現され、{{domxref("AudioContext.listener") }} で参照できます。

+
+ +

記法

+ +
var audioCtx = new AudioContext();
+var panner = audioCtx.createPanner();
+ +

返り値

+ +

{{domxref("PannerNode")}} を返します。

+ +

利用例

+ +

以下の例では、createPanner() メソッドの利用方法と、 {{domxref("AudioListener")}} と{{domxref("PannerNode")}} による空間音響のコントロール方法について解説します。一般的には、聴取者と音源の 3 次元空間上での位置を決め、アプリケーションの動きに合わせてそれらを更新することになります。これを利用することで、キャラクターが世界の中を動き回るようなゲームで、近づくと聞こえ、遠ざかると聞こえなくなるステレオを実現できます。 以下の例では moveRight()moveLeft()、PositionPanner() などを利用して、位置をコントロールしています。

+ +

完全な実装例は panner-node example (ソースコード) を確認してください。このデモでは 2.5 次元上の「メタルの部屋」上で、曲を再生するラジカセの位置を変更させることで変化する音声を体験できます。

+ +

付記:以下の例では比較的新しい属性を利用するために、ブラウザの機能を調べています。例えば位置を設定する {{domxref("AudioListener.forwardX")}}) などです。これらが利用できる場合は利用し、そうでない場合は{{domxref("AudioListener.setOrientation()")}}) のような古いメソッドを利用しています。

+ +
// set up listener and panner position information
+var WIDTH = window.innerWidth;
+var HEIGHT = window.innerHeight;
+
+var xPos = Math.floor(WIDTH/2);
+var yPos = Math.floor(HEIGHT/2);
+var zPos = 295;
+
+// define other variables
+
+var AudioContext = window.AudioContext || window.webkitAudioContext;
+var audioCtx = new AudioContext();
+
+var panner = audioCtx.createPanner();
+panner.panningModel = 'HRTF';
+panner.distanceModel = 'inverse';
+panner.refDistance = 1;
+panner.maxDistance = 10000;
+panner.rolloffFactor = 1;
+panner.coneInnerAngle = 360;
+panner.coneOuterAngle = 0;
+panner.coneOuterGain = 0;
+
+if(panner.orientationX) {
+  panner.orientationX.value = 1;
+  panner.orientationY.value = 0;
+  panner.orientationZ.value = 0;
+} else {
+  panner.setOrientation(1,0,0);
+}
+
+var listener = audioCtx.listener;
+
+if(listener.forwardX) {
+  listener.forwardX.value = 0;
+  listener.forwardY.value = 0;
+  listener.forwardZ.value = -1;
+  listener.upX.value = 0;
+  listener.upY.value = 1;
+  listener.upZ.value = 0;
+} else {
+  listener.setOrientation(0,0,-1,0,1,0);
+}
+
+var source;
+
+var play = document.querySelector('.play');
+var stop = document.querySelector('.stop');
+
+var boomBox = document.querySelector('.boom-box');
+
+var listenerData = document.querySelector('.listener-data');
+var pannerData = document.querySelector('.panner-data');
+
+leftBound = (-xPos) + 50;
+rightBound = xPos - 50;
+
+xIterator = WIDTH/150;
+
+// listener will always be in the same place for this demo
+
+if(listener.positionX) {
+  listener.positionX.value = xPos;
+  listener.positionY.value = yPos;
+  listener.positionZ.value = 300;
+} else {
+  listener.setPosition(xPos,yPos,300);
+}
+
+listenerData.innerHTML = 'Listener data: X ' + xPos + ' Y ' + yPos + ' Z ' + 300;
+
+// panner will move as the boombox graphic moves around on the screen
+function positionPanner() {
+  if(panner.positionX) {
+    panner.positionX.value = xPos;
+    panner.positionY.value = yPos;
+    panner.positionZ.value = zPos;
+  } else {
+    panner.setPosition(xPos,yPos,zPos);
+  }
+  pannerData.innerHTML = 'Panner data: X ' + xPos + ' Y ' + yPos + ' Z ' + zPos;
+}
+ +
+

listener と panner に設定された位置が正しく機能するためには、それらがスクリーン上の位置を正しく反映している必要があります。そのためには少し面倒な計算が必要となりますが、すこしやれば慣れる類のものです。

+
+ +

仕様

+ + + + + + + + + + + + + + +
仕様状況コメント
{{SpecName('Web Audio API', '#widl-AudioContext-createPanner-PannerNode', 'createPanner()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザー互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatVersionUnknown}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidEdgeFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}{{CompatVersionUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

関連情報

+ + diff --git a/files/ja/web/api/baseaudiocontext/createperiodicwave/index.html b/files/ja/web/api/baseaudiocontext/createperiodicwave/index.html new file mode 100644 index 0000000000..825a1a8de5 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createperiodicwave/index.html @@ -0,0 +1,139 @@ +--- +title: AudioContext.createPeriodicWave() +slug: Web/API/AudioContext/createPeriodicWave +translation_of: Web/API/BaseAudioContext/createPeriodicWave +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのcreatePeriodicWave()メソッドは、周期的な波形を定義するために使われる{{domxref("PeriodicWave")}}を生成します。これは{{ domxref("OscillatorNode") }}の出力を決めるために使われます。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var wave = audioCtx.createPeriodicWave(real, imag);
+ +

戻り値

+ +

{{domxref("PeriodicWave")}}

+ +

引数

+ +
+
real
+
余弦項の配列 (伝統的なA項)
+
imag
+
正弦項の配列 (伝統的なB項)
+
+ +

+ +

The following example illustrates simple usage of createPeriodicWave(), to create a {{domxref("PeriodicWave")}} object containing a simple sine wave.

+ +
var real = new Float32Array(2);
+var imag = new Float32Array(2);
+var ac = new AudioContext();
+var osc = ac.createOscillator();
+
+real[0] = 0;
+imag[0] = 0;
+real[1] = 1;
+imag[1] = 0;
+
+var wave = ac.createPeriodicWave(real, imag);
+
+osc.setPeriodicWave(wave);
+
+osc.connect(ac.destination);
+
+osc.start();
+osc.stop(2);
+ +

This works because a sound that contains only a fundamental tone is by definition a sine wave.
+
+ Here, we create a PeriodicWave with two values. The first value is the DC offset, which is the value at which the oscillator starts. 0 is good here, because we want to start the curve at the middle of the [-1.0; 1.0] range.

+ +

The second and subsequent values are sine and cosine components. You can think of it as the result of a Fourier transform, where you get frequency domain values from time domain value. Here, with createPeriodicWave(), you specify the frequencies, and the browser performs a an inverse Fourier transform to get a time domain buffer for the frequency of the oscillator. Here, we only set one component at full volume (1.0) on the fundamental tone, so we get a sine wave.

+ +

The coefficients of the Fourier transform should be given in ascending order (i.e. (a+bi)ei,(c+di)e2i,(f+gi)e3i\left(a+bi\right)e^{i} , \left(c+di\right)e^{2i} , \left(f+gi\right)e^{3i}   etc.) and can be positive or negative.  A simple way of manually obtaining such coefficients (though not the best) is to use a graphing calculator.

+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createPeriodicWave-PeriodicWave-Float32Array-real-Float32Array-imag', 'createPeriodicWave')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}{{CompatVersionUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatChrome(33.0)}}
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/createscriptprocessor/index.html b/files/ja/web/api/baseaudiocontext/createscriptprocessor/index.html new file mode 100644 index 0000000000..d3c80ae2cb --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createscriptprocessor/index.html @@ -0,0 +1,69 @@ +--- +title: AudioContext.createScriptProcessor() +slug: Web/API/AudioContext/createScriptProcessor +translation_of: Web/API/BaseAudioContext/createScriptProcessor +--- +

{{ APIRef("AudioContext") }}

+
+

{{ domxref("AudioContext") }} の createScriptProcessor() メソッドを利用することで、ダイレクトな音声処理ができる {{domxref("ScriptProcessorNode")}} オブジェクトを作成できます。

+
+
+

注意: このノードの利用方法に関しては {{domxref("ScriptProcessorNode")}} をご覧ください。

+
+

構文

+
 ScriptProcessorNode             createScriptProcessor (optional unsigned long bufferSize = 0 , optional unsigned long numberOfInputChannels = 2 , optional unsigned long numberOfOutputChannels = 2 );
+

+

createScriptProcessor()の利用例は以下の通りになります。Web Audio API が提供する機能では望む音声処理を実現できない場合に、このメソッドを利用します。これを利用することで、どの様な音声処理でも記述できます。

+
SineWave = function(context) {
+  var that = this;
+  this.x = 0; // Initial sample number
+  this.context = context;
+  this.node = context.createScriptProcessor(1024, 1, 1);
+  this.node.onaudioprocess = function(e) { that.process(e) };
+}
+
+SineWave.prototype.process = function(e) {
+  var data = e.outputBuffer.getChannelData(0);
+  for (var i = 0; i < data.length; ++i) {
+    data[i] = Math.sin(this.x++);
+  }
+}
+
+SineWave.prototype.play = function() {
+  this.node.connect(this.context.destination);
+}
+
+SineWave.prototype.pause = function() {
+  this.node.disconnect();
+}
+

引数

+
+
+ bufferSize
+
+ サンプルフレームを単位としたバッファのサイズです。指定する場合は、次のいずれかの値でなくてはなりません: 256, 512, 1024, 2048, 4096, 8192, 16384 。指定されない場合、もしくは 0 が指定された場合、環境における最適な値が設定されます。この値はノードが生存する限り同じ値が利用され、その値は 2 の冪上です。
+
+ この値は audioprocess イベントの発生頻度と、イベントごとに渡されるサンプルフレームの大きさを決めます。小さい値を指定すると低遅延となり、大きな値を指定すると音声の破損やグリッチを避けられます。この値は自分で決めず、実装に決めさせることが遅延と品質の面から推奨されます。
+
+ numberOfInputChannels
+
+ 入力のチャンネル数を整数で指定します。デフォルト値は 2 で、最大 32 チャンネルまでサポートします。
+
+ numberOfOutputChannels
+
+ 出力するチャンネル数を整数で指定します。デフォルト値は 2 で、最大 32 チャンネルまでサポートします。
+
+
+

Important: Webkit currently (version 31) requires that a valid bufferSize be passed when calling this method.

+
+
+

注意: numberOfInputChannelsnumberOfOutputChannels の両方に 0 を指定することはできません。

+
+

返り値

+

A {{domxref("ScriptProcessorNode")}}.

+

ブラウザ互換性

+

{{page("/en-US/docs/Web/API/AudioContext","Browser_compatibility")}}

+

仕様

+

{{page("/en-US/docs/Web/API/AudioContext","Specifications")}}

+

関連情報

+

{{page("/en-US/docs/Web/API/AudioContext","See_also")}}

diff --git a/files/ja/web/api/baseaudiocontext/createstereopanner/index.html b/files/ja/web/api/baseaudiocontext/createstereopanner/index.html new file mode 100644 index 0000000000..c77689aa90 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/createstereopanner/index.html @@ -0,0 +1,128 @@ +--- +title: AudioContext.createStereoPanner() +slug: Web/API/AudioContext/createStereoPanner +translation_of: Web/API/BaseAudioContext/createStereoPanner +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのcreateStereoPanner()メソッドは、音源にステレオパンニングを適用する{{ domxref("StereoPannerNode") }}を生成します。入力されたオーディオストリームは、低コストなequal-powerパンニングアルゴリズムで位置が決められます。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var panNode = audioCtx.createStereoPanner();
+ +

戻り値

+ +

{{domxref("StereoPannerNode")}}

+ +

+ +

このStereoPannerNodeサンプル(ソースコード)のHTMLには、{{htmlelement("audio")}}要素と、パン値を増減させるスライダー{{domxref("input")}}しかありません。JavaScpriptでは、{{domxref("MediaElementAudioSourceNode")}}と{{domxref("StereoPannerNode")}}を生成し、この2つをconnect()メソッドで接続しています。そして、スライダーを動かすと、oninputイベントハンドラで{{domxref("StereoPannerNode.pan")}}パラメータの値を変更し、ディスプレイのパン値を更新しています。

+ +

スライダーを左から右に動かすと、音楽のスピーカーからの出力が左から右にパンされます。

+ +
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+var myAudio = document.querySelector('audio');
+
+var panControl = document.querySelector('.panning-control');
+var panValue = document.querySelector('.panning-value');
+
+pre.innerHTML = myScript.innerHTML;
+
+// MediaElementAudioSourceNodeを生成し、そこにHTMLMediaElementを入れる
+var source = audioCtx.createMediaElementSource(myAudio);
+
+// ステレオパンナーを生成する
+var panNode = audioCtx.createStereoPanner();
+
+// イベントハンドラ関数で、スライダーが動いたとき左右のパンの値を左右する
+
+panControl.oninput = function() {
+  panNode.pan.value = panControl.value;
+  panValue.innerHTML = panControl.value;
+}
+
+// AudioBufferSourceNodeをpanNodeに接続し、panNodeを行き先(destination)に接続する
+// これでこのコントロールで音楽をパンを調整することができる
+source.connect(panNode);
+panNode.connect(audioCtx.destination);
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-createStereoPanner-StereoPannerNode', 'createStereoPanner()')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(42.0)}}{{CompatGeckoDesktop(37.0)}} {{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatNo}}37.02.2{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatVersionUnknown}}
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/currenttime/index.html b/files/ja/web/api/baseaudiocontext/currenttime/index.html new file mode 100644 index 0000000000..0d2a92b3ea --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/currenttime/index.html @@ -0,0 +1,112 @@ +--- +title: AudioContext.currentTime +slug: Web/API/AudioContext/currentTime +translation_of: Web/API/BaseAudioContext/currentTime +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのcurrentTime読み取り専用プロパティは、再生、タイムラインの可視化などのスケジューリングで使用できる単純増加するハードウェア時間をdoubleの秒数で返します。0から始まります。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+console.log(audioCtx.currentTime);
+ +

+ +

double

+ +

+ +
+

注: 完全な実装の例は、MDN Github repopanner-nodeなどを参照してください。audioCtx.currentTimeをあなたのブラウザで使ってみてください。

+
+ +
var AudioContext = window.AudioContext || window.webkitAudioContext;
+var audioCtx = new AudioContext();
+// 古いwebkit/blinkブラウザではプレフィックスが必要です
+
+...
+
+console.log(audioCtx.currentTime);
+
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-currentTime', 'currentTime')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/decodeaudiodata/index.html b/files/ja/web/api/baseaudiocontext/decodeaudiodata/index.html new file mode 100644 index 0000000000..db9c106e52 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/decodeaudiodata/index.html @@ -0,0 +1,155 @@ +--- +title: AudioContext.decodeAudioData() +slug: Web/API/AudioContext/decodeAudioData +tags: + - API + - Audio + - AudioContext + - BaseAudioContext + - Method + - Reference + - Web Audio API + - decodeAudioData +translation_of: Web/API/BaseAudioContext/decodeAudioData +--- +

{{ APIRef("Web Audio API") }}

+ +

decodeAudioData() は {{ domxref("BaseAudioContext") }} のメソッドで、 {{domxref("ArrayBuffer")}} に書き込まれた音声ファイルデータを非同期にデコードするために使用されます。この場合、 ArrayBuffer は {{domxref("XMLHttpRequest")}} と {{domxref("FileReader")}} から読み込まれます。デコードされた {{domxref("AudioBuffer")}} は {{domxref("AudioContext")}} のサンプリングレートにリサンプリングされ、コールバックやプロミスに渡されます。

+ +

この方法は、オーディオトラックから Web Audio API 用のオーディオソースを作成する際に推奨される方法です。この方法は、音声ファイルの断片的なデータではなく、完全なファイルデータに対してのみ動作します。

+ +

構文

+ +

古いコールバック構文:

+ +
baseAudioContext.decodeAudioData(ArrayBuffer, successCallback, errorCallback);
+ +

新しいプロミスベースの構文:

+ +
Promise<decodedData> baseAudioContext.decodeAudioData(ArrayBuffer);
+ +

引数

+ +
+
ArrayBuffer
+
デコードする音声データが入った ArrayBuffer です。通常は{{domxref("XMLHttpRequest")}}, {{domxref("WindowOrWorkerGlobalScope.fetch()")}}, {{domxref("FileReader")}} から取得します。
+
successCallback
+
デコードが完了すると呼び出されるコールバック関数です。このコールバックの引数は1つで、 decodedData (デコードされた PCM 音声データ) を表す {{domxref("AudioBuffer")}} です。通常は、デコードされたデータを {{domxref("AudioBufferSourceNode")}} に入れて、そこから再生したり、好きなように操作したりすることができます。
+
errorCallback
+
任意のエラーコールバックで、音声データのデコードでエラーが発生すると呼び出されます。
+
+ +

返値

+ +

なし、または decodedData で満足する {{domxref("Promise") }} オブジェクトで.

+ +

+ +

ここでは最初に古いコールバックベースのシステムを、次に新しいプロミスベースの構文を取り上げます。

+ +

古いコールバックベースの構文

+ +

この例では、 getData() 関数は XHR を使用して音声トラックを読み込み、リクエストの responseTypearraybuffer に設定して、レスポンスとして配列バッファーを返すようにして、それを audioData 変数に格納しています。それからこのバッファーを decodeAudioData() 関数に渡します。成功したコールバックは、デコードに成功した PCM データを受け取り、 {{ domxref("AudioContext.createBufferSource()") }} で作成した {{ domxref("AudioBufferSourceNode") }} に入れ、ソースを {{domxref("AudioContext.destination") }} に接続してループするように設定します。

+ +

ボタンは単に getData() を実行して、それぞれトラックの読み込みと再生、停止を行うだけです。ソースの stop() メソッドが呼ばれると、ソースは消滅します。

+ +
+

注: ライブ例の実行 (またはソースの閲覧) もできます。

+
+ +
// 変数の定義
+
+var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+var source;
+
+var pre = document.querySelector('pre');
+var myScript = document.querySelector('script');
+var play = document.querySelector('.play');
+var stop = document.querySelector('.stop');
+
+// 音声トラックの読み込みには XHR を使い、
+// decodeAudioData でデコードし、バッファーに格納する
+// そして、そのバッファーを source に設定する
+
+function getData() {
+  source = audioCtx.createBufferSource();
+  var request = new XMLHttpRequest();
+
+  request.open('GET', 'viper.ogg', true);
+
+  request.responseType = 'arraybuffer';
+
+
+  request.onload = function() {
+    var audioData = request.response;
+
+    audioCtx.decodeAudioData(audioData, function(buffer) {
+        source.buffer = buffer;
+
+        source.connect(audioCtx.destination);
+        source.loop = true;
+      },
+
+      function(e){ console.log("Error with decoding audio data" + e.err); });
+
+  }
+
+  request.send();
+}
+
+// 音声の停止と再生を行うボタン
+
+play.onclick = function() {
+  getData();
+  source.start(0);
+  play.setAttribute('disabled', 'disabled');
+}
+
+stop.onclick = function() {
+  source.stop(0);
+  play.removeAttribute('disabled');
+}
+
+
+// pre要素にスクリプトを設定する
+
+pre.innerHTML = myScript.innerHTML;
+ +

新しいプロミスベースの構文

+ +
ctx.decodeAudioData(audioData).then(function(decodedData) {
+ // デコードしたデータをここで使う
+});
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様状態備考
{{SpecName('Web Audio API', '#dom-baseaudiocontext-decodeaudiodata', 'decodeAudioData()')}}{{Spec2('Web Audio API')}}
+ +

ブラウザーの互換性

+ +
+ + +

{{Compat("api.BaseAudioContext.decodeAudioData")}}

+
+ +

関連情報

+ + diff --git a/files/ja/web/api/baseaudiocontext/destination/index.html b/files/ja/web/api/baseaudiocontext/destination/index.html new file mode 100644 index 0000000000..f93e8682f1 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/destination/index.html @@ -0,0 +1,114 @@ +--- +title: AudioContext.destination +slug: Web/API/AudioContext/destination +translation_of: Web/API/BaseAudioContext/destination +--- +

{{ APIRef("Web Audio API") }}

+ +
+

インターフェースのdestinationプロパティは、コンテキストの全ての音声の最終的な行き先を表す{{ domxref("AudioDestinationNode") }} を戻します。これは、あなたのコンピュータのスピーカーのような、オーディオレンダリングデバイスと考えることができます。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+gainNode.connect(audioCtx.destination);
+ +

+ +

{{ domxref("AudioDestinationNode") }}

+ +

+ +
+

注: 完全な実装の例は、MDN Github repopanner-nodeなどを参照してください。

+
+ +
var AudioContext = window.AudioContext || window.webkitAudioContext;
+var audioCtx = new AudioContext();
+// 古いwebkit/blinkブラウザではプレフィックスが必要です
+
+var oscillatorNode = audioCtx.createOscillator();
+var gainNode = audioCtx.createGain();
+
+oscillatorNode.connect(gainNode);
+gainNode.connect(audioCtx.destination);
+
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-destination', 'destination')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/listener/index.html b/files/ja/web/api/baseaudiocontext/listener/index.html new file mode 100644 index 0000000000..7b4f394727 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/listener/index.html @@ -0,0 +1,112 @@ +--- +title: AudioContext.listener +slug: Web/API/AudioContext/listener +translation_of: Web/API/BaseAudioContext/listener +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのlistenerプロパティは、3次元音声を実装するために使う{{ domxref("AudioListener") }}オブジェクトを返します。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var myListener = audioCtx.listener;
+ +

+ +

{{ domxref("AudioListener") }}

+ +

+ +
+

注: 完全な実装の例は、panner-nodeを参照してください。

+
+ +
var AudioContext = window.AudioContext || window.webkitAudioContext;
+var audioCtx = new AudioContext();
+// 古いwebkit/blinkブラウザではプレフィックスが必要です
+
+...
+
+var myListener = audioCtx.listener;
+
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-listener', 'listener')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/onstatechange/index.html b/files/ja/web/api/baseaudiocontext/onstatechange/index.html new file mode 100644 index 0000000000..5ce3ecaf26 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/onstatechange/index.html @@ -0,0 +1,101 @@ +--- +title: AudioContext.onstatechange +slug: Web/API/AudioContext/onstatechange +translation_of: Web/API/BaseAudioContext/onstatechange +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのonstatechangeプロパティは、{{Event("statechange")}}イベントが発火した(これはオーディオコンテキストの状態が変わったとき発生します)とき呼ばれるイベントハンドラ関数を定義します。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+audioCtx.onstatechange = function() { ... };
+ +

+ +

次のスニペットはAudioContext states デモの一部です(すぐに実行)。{{domxref("AudioContext.onstatechange")}}ハンドラは、状態が変わるたびにコンソールにログを出力するために使われています。

+ +
audioCtx.onstatechange = function() {
+  console.log(audioCtx.state);
+}
+
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-onstatechange', 'onstatechange')}}{{Spec2('Web Audio API')}} 
+ +

互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(43.0)}}{{CompatGeckoDesktop(40.0)}} {{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/samplerate/index.html b/files/ja/web/api/baseaudiocontext/samplerate/index.html new file mode 100644 index 0000000000..8715d8ae39 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/samplerate/index.html @@ -0,0 +1,112 @@ +--- +title: AudioContext.sampleRate +slug: Web/API/AudioContext/sampleRate +translation_of: Web/API/BaseAudioContext/sampleRate +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのsampleRateプロパティは、このオーディオコンテキストの全てのノードで使われるサンプルレート(1秒あたりのサンプル数)を浮動小数点で返します。

+
+ +

構文

+ +
var audioCtx = new AudioContext();
+var mySampleRate = audioCtx.sampleRate;
+ +

+ +

浮動小数点

+ +

+ +
+

注: 完全な実装の例は、MDN Github repopanner-nodeなどを参照してください。audioCtx.sampleRateをあなたのブラウザで使ってみてください。

+
+ +
var AudioContext = window.AudioContext || window.webkitAudioContext;
+var audioCtx = new AudioContext();
+// 古いwebkit/blinkブラウザではプレフィックスが必要です
+
+...
+
+console.log(audioCtx.sampleRate);
+
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#widl-AudioContext-sampleRate', 'sampleRate')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(10.0)}}{{property_prefix("webkit")}}{{CompatGeckoDesktop(25.0)}} {{CompatNo}}15.0{{property_prefix("webkit")}}
+ 22 (unprefixed)
6.0{{property_prefix("webkit")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}26.01.2{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}33.0
+
+ +

参考

+ + diff --git a/files/ja/web/api/baseaudiocontext/state/index.html b/files/ja/web/api/baseaudiocontext/state/index.html new file mode 100644 index 0000000000..a19d03f9af --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/state/index.html @@ -0,0 +1,66 @@ +--- +title: AudioContext.state +slug: Web/API/AudioContext/state +translation_of: Web/API/BaseAudioContext/state +--- +

{{ APIRef("Web Audio API") }}

+ +
+

{{ domxref("AudioContext") }}インターフェースのstate読取専用プロパティは、現在のAudioContextの状態を返します。

+
+ +

構文

+ +
baseAudioContext.state;
+ +

+ +

{{domxref("DOMString")}}。取りうる値は:

+ + + +

+ +

次のスニペットはAudioContext states デモの一部です(すぐに実行)。{{domxref("AudioContext.onstatechange")}}ハンドラは、状態が変わるたびにコンソールにログを出力するために使われています。

+ +
audioCtx.onstatechange = function() {
+  console.log(audioCtx.state);
+}
+
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Audio API', '#dom-baseaudiocontext-state', 'state')}}{{Spec2('Web Audio API')}} 
+ +

ブラウザ互換性

+ +
+
+ + +

{{Compat("api.BaseAudioContext.state")}}

+
+
+ +

参考

+ + -- cgit v1.2.3-54-g00ecf