一個免費的音訊波形產生器，會把解碼後的音訊檔案轉成一張可縮放的靜態圖片，顯示每一段時間切片中音量最大與最小的取樣。這張圖片是根據真實音訊資料繪製而成——在固定且等長的影格範圍內，跨每一個已解碼聲道取得的最小與最大取樣值——並儲存成可放在網頁、簡報或影片時間軸上的向量圖形。由於 SVG 是依據驗證過的數字與所選顏色產生，而不是來自檔名或內嵌的來源中繼資料，因此輸出是可重現的：相同的檔案、寬度、高度與顏色組合，永遠會產生相同的 SVG 標記。解碼、峰值擷取、SVG 寫入、預覽與下載全部都在你目前的分頁內完成，因此原始音訊與產生的圖形從不離開瀏覽器，而且每次產生時同一個檔案都會回傳同一張圖片。無需伺服器往返、無需帳號、不玩副檔名把戲——這張圖片就只是你已解碼音訊的數學再加上 SVG 標記。
音訊波形產生器 會在你目前的分頁內處理整個工作流程。你挑選一個瀏覽器實際能解碼的檔案，設定寬度介於 320 到 1,600 像素之間、高度介於 120 到 600 像素之間，再從標準的六位數十六進位色彩控制項中選擇背景與波形顏色，接著工具就會寫出一個包含一個背景矩形和一組垂直峰值線的單一 SVG。原始音訊絕不會被重新編寫、檔案絕不會被上傳、圖形也絕不會被送到任何地方——峰值擷取、SVG 產生、預覽繪製與下載，全都留在產生它們的那個分頁中。
免費的瀏覽器型音訊波形產生器實際做了什麼
這類音訊波形是時域圖，不是頻率圖。水平軸是時間，從第一個解碼後的影格一路延伸到最後一個；垂直軸則是取樣振幅。在每個水平位置上的一條垂直線，顯示的是在該區段內、跨所有聲道所找到的最大正向取樣與最小取樣之間的差距。線條高代表音訊在該瞬間於兩個方向上都接近滿刻度；線條短則代表音訊音量小或幾近靜音。
這個工具採用刻意簡化的峰值包絡法。每個已解碼的取樣影格會被放進 N 個連續區段之一，其中 N 是你要求的圖片寬度、1,000 以及已解碼影格總數三者中的最小值。針對每個區段，工具會掃描其中包含的影格，跨每一個已解碼聲道取最小與最大的有限取樣值，將防禦性的超出範圍值限制在 −1 到 1 之間，然後從該區段的最大值到最小值畫出一條垂直的 SVG 線。第一個區段從影格零開始，最後一個區段到最後一個已解碼影格結束，所以相鄰範圍之間不會略過任何影格。
這個設計會帶出兩個實際的結果。第一，短音訊片段並不會獲得比檔案實際內容更多的獨立量測點——區段數上限是已解碼的影格數，因此當一段影格數少於所要求的寬度與 1,000 欄上限時，會以其自身的影格數為準；而較長、影格數遠多於此的音訊則會以 1,000 欄上限為準，讓 SVG 輸出與處理量保持在可控範圍內。第二，圖片是合併的峰值總覽，而非分開的左右兩條音軌，所以一個區段的最小值可能來自某個聲道，而最大值來自另一個聲道。
峰值包絡取樣如何影響輸出
選擇每個區段取最小與最大值，而非每個區段只取單一任意取樣，正是讓短暫突波得以被看見的原因。小鼓一擊、拍手、單一次的鼓組瞬音只持續寥寥數個取樣，而單一取樣法常常會挑到區段中較安靜的瞬間，把尖峰藏起來。最小加最大值法會同時找到最大的正向尖峰與最大的負向尖峰，因此短暫的滿刻度音訊仍會以全高的線條呈現，而不會被融入周圍的靜默中。
輸出中的垂直座標是確定性的。垂直中心正好位於所要求高度的一半，而 +1 或 −1 的取樣會從該中心向上或向下延伸到高度的 45%。這在上方與下方各保留 5% 的邊界，讓圖片永遠不會碰到邊緣。欄位會在所要求的寬度上均勻置中，這代表你可以把 SVG 放到任何版面配置中，不必手動微調邊界或補償不平均的欄距。
對於立體聲或多聲道檔案，圖片刻意做成合併的總覽。一個區段的最小值可能來自左聲道，而最大值來自右聲道，工具也絕不會把聲道平均成新的訊號。如果你需要分開的左右兩條音軌，請透過能將各聲道暴露為獨立音軌的音訊編輯器分別處理每一聲道，不要期望波形圖片替你做到這件事。
三步驟產生音訊波形
- 選擇一個瀏覽器可解碼的音訊檔案，且須在所公布的壓縮與解碼限制之內。本工具接受 MP3、WAV、M4A、AAC、Ogg、WebM 或 FLAC，但僅限於目前的瀏覽器與作業系統能實際解碼其真實編碼格式時——副檔名或 MIME 標籤無法保證這一點。不支援、損毀、空的或偽裝過的檔案會回傳錯誤，而非產生半張圖片。
- 設定 SVG 寬度、高度、背景顏色與波形顏色，然後產生本地的峰值包絡。寬度可為 320–1,600 像素，高度為 120–600 像素。顏色來自瀏覽器的六位數十六進位色彩控制項，而 SVG 是根據驗證過的數字與這些顏色所產生，並非從檔名或內嵌來源中繼資料複製而來。
- 檢查回報的影格數與峰值欄數，查看預覽或 SVG 文字內容，然後下載精確的可縮放 SVG。頁面會在可展開的檢查器中顯示完整產生的 SVG 標記，下載所使用的也是同一段字串。選擇替換檔案、變更選項、重新產生或離開頁面時，會撤銷已失效的物件 URL，因此舊的圖片不會被誤用來代表新的輸入。
下載之後，該檔案是一個純文字的 SVG，內含一個背景矩形、一組具有固定像素尺寸的峰值線，以及一個對應的 viewBox。SVG 放到其他顯示尺寸時仍保持銳利，但極大尺寸的印刷或編輯工作流程仍可能需要不同的線條粗細或更詳細的來源資料——若需要微調線條粗細、替換顏色或加上標籤，請在支援 SVG 的編輯器中開啟該檔案。
工具在處理檔案前會檢查的限制
瀏覽器端的音訊工具共用同一組已解碼資料的預算，波形工具則會套用全部的限制。壓縮檔案大小不得超過 50 MiB。解碼後的音訊長度不得超過 5 分鐘，聲道數為 1 到 8 個，採用 8,000 到 192,000 Hz 的取樣率，且總聲道取樣數不得超過 3,000 萬。這些檢查之所以重要，是因為一個小的壓縮檔案可能會展開成大得多的浮點聲道陣列，而超出限制的音訊會被整體拒絕，而不是靜默地從開頭截斷。
| 限制 | 允許範圍 |
|---|---|
| 壓縮檔案大小 | 最多 50 MiB |
| 解碼後長度 | 最多 5 分鐘 |
| 聲道數 | 1 到 8 |
| 取樣率 | 8,000 到 192,000 Hz |
| 總聲道取樣數 | 最多 30,000,000 |
| 圖片寬度 | 320 到 1,600 像素 |
| 圖片高度 | 120 到 600 像素 |
| 峰值欄數 | min(width, 1,000, decoded frames) |
只要上述任何一項數字超出允許範圍，工具會將檔案整體拒絕，而非產生半張圖片。區段數上限有其獨立的重要性：一段擁有數百萬影格的長音訊仍最多產生 1,000 欄，這讓 SVG 輸出大小與處理時間在原始音訊長短不一時都保持在可控範圍內。
SVG 與其他波形圖片格式的比較
| 格式 | 縮放時保持銳利 | 可作為純文字編輯 | 本工具匯出 |
|---|---|---|---|
| SVG（本工具的輸出） | 是 | 是 | 是 |
| PNG | 否——固定點陣 | 否 | 否 |
| JPEG | 否——固定點陣且有損 | 否 | 否 |
| GIF | 否——固定點陣且使用調色盤 | 否 | 否 |
決定性的差異在於 SVG 是一種向量格式，它以座標與顏色描述每一條峰值線，而非以像素網格描述。把同一個 SVG 放進 300 像素的卡片或 1,500 像素的主視覺橫幅中，線條都會保持一像素寬且銳利；而為較小尺寸產生的 PNG 一旦放大就會變得模糊。SVG 也是純文字，所以頁面上的檢查器與任何文字編輯器都能讀取或修改它；其他格式既不可讀，重新匯出後也會喪失保真度。
為 SVG 挑選尺寸、顏色與擺放位置
寬度與高度比起其他因素更決定了圖片的長寬比。1,200 乘 200 的圖片會給你一條細長的橫幅，相當適合部落格頁首、播客單集頁面與音訊播放器面板。600 乘 600 的圖片則給你一個正方區塊，適合社群媒體卡片與內嵌插圖。當比例高於約 1:3 時，垂直空間就會開始浪費，因為多數音訊都低於滿刻度，幾乎不會填滿可用高度。
背景與波形顏色來自標準的六位數十六進位值，兩者之間的對比正是讓峰值清晰可見的關鍵。在大多數網頁上，近白色的波形配上近黑色的背景最容易閱讀；深色波形配淺色卡片則適合印刷與簡報。無論你怎麼挑選，工具都會直接把顏色寫入 SVG，因此日後任何主題或品牌更動，只需在 SVG 編輯器中開啟檔案並替換兩個字串即可。
輸出同樣是確定性的，這在你把同一波形放到多個頁面或螢幕上時格外重要。同一段來源音訊、同一組寬度、高度與顏色，永遠會產生相同的 SVG 標記，欄位位置與線條座標也完全一致，因此播客的兩集能共享相同的視覺風格而無需手動對齊。由於圖片是由相同的數字重新產生而非重新編碼，替換某個元素的顏色並不會移動其他任何元素的欄位位置。
When a peak waveform is the right picture — and when it isn't
A peak waveform is a faithful picture of how loud each moment of the audio got. It is not a calibrated loudness meter, and two recordings can show very similar peaks while sounding different because perceived loudness depends on duration, frequency balance, dynamics, and playback conditions. It is also not a spectrogram: time still runs left to right, but the vertical line in this picture represents sample amplitude range, not frequency. Do not use the output to diagnose hearing, equipment, clipping history, phase, or mastering compliance.
The picture is the right choice when the goal is to give a viewer an immediate visual cue about how loud or busy a recording is. It is the wrong choice when you need frequency content (use a spectrogram for that), a calibrated loudness reading (use a LUFS meter), or separate left and right channels (render each channel individually through an audio editor). The Web Audio API exposes the decoded frames that feed this tool as a structured AudioBuffer, and the peak-envelope method described here sits on top of that buffer without modifying it.
For a deeper look, see Generate Audio Waveform Not Working: A Browser Fix.
For a deeper look, see How to Convert Audio to Waveform: A Local SVG Method.