BaseAudioContext: phương thức createStereoPanner()
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021.
Phương thức createStereoPanner() của giao diện BaseAudioContext tạo ra một StereoPannerNode, có thể được dùng để áp dụng panning stereo cho một nguồn âm thanh.
Nó định vị một luồng âm thanh đầu vào trong ảnh stereo bằng một thuật toán panning chi phí thấp.
Note:
Hàm dựng StereoPannerNode()
là cách được khuyến nghị để tạo một StereoPannerNode; xem
Tạo một AudioNode.
Cú pháp
createStereoPanner()
Tham số
Không có.
Giá trị trả về
Một StereoPannerNode.
Ví dụ
Trong ví dụ StereoPannerNode của chúng tôi (xem mã nguồn), phần HTML có một phần tử <audio> đơn giản cùng một thanh trượt <input> để tăng và giảm giá trị pan. Trong phần JavaScript, chúng tôi tạo một MediaElementAudioSourceNode và một StereoPannerNode, rồi kết nối hai đối tượng này với nhau bằng phương thức connect(). Sau đó chúng tôi dùng trình xử lý sự kiện oninput để thay đổi giá trị của tham số StereoPannerNode.pan và cập nhật phần hiển thị giá trị pan khi thanh trượt được di chuyển.
Di chuyển thanh trượt sang trái và phải khi nhạc đang phát sẽ pan nhạc tương ứng sang loa trái và loa phải của đầu ra.
const audioCtx = new AudioContext();
const myAudio = document.querySelector("audio");
const panControl = document.querySelector(".panning-control");
const panValue = document.querySelector(".panning-value");
// Tạo một MediaElementAudioSourceNode
// Đưa HTMLMediaElement vào đó
const source = audioCtx.createMediaElementSource(myAudio);
// Tạo một stereo panner
const panNode = audioCtx.createStereoPanner();
// Hàm xử lý sự kiện để tăng panning sang phải và trái
// khi thanh trượt được di chuyển
panControl.oninput = () => {
panNode.pan.setValueAtTime(panControl.value, audioCtx.currentTime);
panValue.textContent = panControl.value;
};
// kết nối MediaElementAudioSourceNode với panNode
// và panNode với đích, để chúng ta có thể phát
// nhạc và điều chỉnh panning bằng các điều khiển
source.connect(panNode);
panNode.connect(audioCtx.destination);
Thông số kỹ thuật
| Specification |
|---|
| Web Audio API> # dom-baseaudiocontext-createstereopanner> |