在產生音訊波形之前,請先確認檔案可由瀏覽器解碼,並符合以下限制:壓縮後大小不超過 50 MiB、解碼後長度不超過五分鐘、1–8 個聲道、8,000–192,000 Hz,以及 3000 萬個聲道樣本。這些預先檢查會決定是否能產生靜態的時域峰值 SVG;它們也會避免讓你誤以為能取得頻譜圖或經過校準的響度報告。

重要的差異在於圖片代表什麼。此工具會繪製解碼後樣本值隨時間變化的最小值與最大值,而不是頻率內容。因此,它適合用來快速概覽音訊檔案,而響度、節奏、音符及其他訊號屬性的分析則應交由專用工具處理。

what should i know before i generate audio waveform
在產生音訊波形之前,我應該知道什麼?

先檢查檔案與瀏覽器

請選擇一個檔案,而非批次處理。可接受的媒體類型為 MP3、WAV、M4A、AAC、Ogg、WebM 和 FLAC,但目前的瀏覽器與作業系統必須支援該檔案實際使用的編碼。熟悉的副檔名或 MIME 標籤無法保證解碼一定能成功。不支援、損毀、空白或偽裝的檔案會傳回錯誤,而不會產生誤導性的圖片。

檢查項目支援需求實際意義
檔案選擇一個可由瀏覽器解碼的音訊檔案此工作流程不支援批次處理。
媒體類型MP3、WAV、M4A、AAC、Ogg、WebM 或 FLAC目前的瀏覽器與作業系統必須支援實際的編碼。
壓縮大小最多 50 MiB較大的來源檔案會被拒絕。
解碼後長度不超過五分鐘完整解碼後的錄音內容必須符合限制。
聲道數一至八個所有解碼後的聲道都會納入同一份合併概覽。
取樣率8,000 至 192,000 Hz超出此範圍的取樣率會被拒絕。
解碼工作量最多 3000 萬個聲道樣本即使音訊經過高度壓縮,仍可能超出此預算。

所有限制都會同時依解碼後的音訊與壓縮檔案進行檢查。小型檔案在解碼後可能會擴展成大量聲道樣本,因此通過位元組大小檢查,並不保證長度、聲道數、取樣率或工作量符合要求。超過限制的檔案會整個被拒絕;此工具不會在未告知的情況下只處理開頭的片段。解碼、擷取峰值、產生 SVG、預覽與下載都會在目前的分頁中進行,音訊檔案與產生的圖片都不會上傳至 Lizely。

產生前決定 SVG 的大小與外觀

請選擇符合圖片顯示位置的尺寸。支援的寬度範圍為 320–1,600 像素,支援的高度範圍為 120–600 像素。輸出內容會保留要求的像素尺寸與相符的 viewBox。這是向量檔案,因此以其他大小顯示時仍能保持清晰;不過,超大型的印刷或編輯工作可能仍需要不同的線條寬度或更詳細的來源資料。

控制項目可用設定需要注意的事項
SVG 寬度320–1,600 像素寬度會影響峰值欄位數的上限。
SVG 高度120–600 像素垂直中心與全刻度峰值的位置會依要求的高度而定。
背景顏色六位數十六進位值背景會寫入為一個 SVG 矩形。
波形顏色六位數十六進位值此顏色會套用至產生的峰值線條。

兩種顏色都應使用六位數十六進位值。選取的背景會成為一個背景矩形,而波形顏色則會套用至產生的峰值線條。由於 SVG 是依經過驗證的數值與顏色值產生,而非從檔名或內嵌來源中繼資料複製而來,因此請檢查可見的結果與 SVG 文字,不要預期檔案標籤會控制外觀。

瞭解峰值包絡法

解碼後,此工具會將所有解碼後的框架分成連續且索引範圍相等的區段。對每個區段,它會找出每個解碼聲道中的最小與最大有限樣本,將防禦性的超出範圍值限制在 -1 至 1 之間,並從該分組的最大值到最小值繪製一條垂直線。解碼後的聲道資料來自瀏覽器的 Web Audio AudioBuffer,而不是將檔名當成視覺資料處理。第一個範圍從框架零開始,最後一個範圍延伸至最後一個解碼後的框架,相鄰範圍之間不會略過任何可接受的框架。

峰值欄位數是下列三個數值中的較小者:要求的圖片寬度、1,000,以及解碼後的框架數。因此,短片段不可能表示出比其本身所含內容更多的獨立測量值,而長輸入則仍會受到 SVG 與處理預算的限制。每個欄位都會以等距的水平位置置中於要求的寬度範圍內。全刻度的正向或負向樣本會從垂直中心向上或向下延伸至要求高度的 45%,並在頂端與底端保留百分之五的邊界空間。

對於立體聲與多聲道檔案,每個分組都會合併所有聲道。其最小值可能來自某個聲道,而最大值則來自另一個聲道。結果是一份合併的峰值概覽,而不是分開的左右聲道軌、可視化的聲道識別資訊,或經過平均處理的替代訊號。如果你需要分別顯示每個聲道,請使用能將每個聲道呈現為獨立音軌的音訊編輯器。來源音訊本身絕不會被改寫。

在瀏覽器中產生波形

  1. 開啟 Audio Waveform Generator,並選擇一個可由瀏覽器解碼且符合輸入限制的檔案。
  2. 設定 SVG 寬度與高度,然後使用六位數十六進位值選擇背景與波形顏色。
  3. 產生本機峰值包絡,讓目前的分頁解碼檔案並建立 SVG。
  4. 檢查回報的框架數與峰值欄位數,然後檢視預覽或展開的完整 SVG 文字。
  5. 下載可縮放且完全一致的 SVG。該檔案是以文字為主的 SVG,而非 PNG、JPEG、影片或音訊,下載的字串也與 SVG 檢視器中顯示的內容完全相同。

如果想要不同的結果,請在再次產生前替換檔案或變更設定。選擇替代檔案、變更選項、再次產生或離開頁面,都會撤銷過期的物件 URL,避免較舊的圖片看似代表新的輸入內容。

驗證數量並檢查可下載的 SVG

回報的數量是迅速察覺意外結果最快的方法。框架數應與解碼後的輸入相符,峰值欄位數則應與要求的寬度、1,000 及該框架數三者中的較小者一致。如果音訊意外地很短,欄位數可能會受到解碼後框架數的限制,而非圖片寬度。

請開啟可展開的 SVG 檢視器,檢查寬度、高度、viewBox、背景顏色與峰值線條群組。標記內容包含一個背景矩形與一組峰值線條;下載使用的是完全相同的 SVG 字串,而非另外算繪的圖片。這讓你能在支援 SVG 的編輯器中開啟檔案、加以檢查,並將其當作可編輯的素材重複使用。檔名或內嵌來源標籤不會複製到產生的標記中,因此視覺與結構檢查比期待中繼資料出現在 SVG 中更可靠。

僅將圖片用於峰值波形所能呈現的內容

峰值波形不是經過校準的響度計。兩段錄音可能具有相似的可見峰值,聽起來卻大不相同,因為感知響度也取決於長度、頻率平衡、動態與播放條件。它也不是頻譜圖:時間由左至右延伸,但每條垂直線呈現的是振幅範圍,而不是頻率。此圖片不會計算頻率內容、節拍、音符、響度、語音、瞬態或音樂結構。

不要使用此圖片來診斷聽力、設備問題、削波歷程、相位或母帶製作規範。請將它用於其實際代表的內容:解碼後樣本峰值隨時間變化的確定性、可縮放概覽。因此,它適合用於說明片段、快速預覽音訊檔案的形狀,或將向量波形帶入支援 SVG 的編輯工作流程。若需要獨立的聲道軌或更豐富的訊號分析,請改用針對該特定任務設計的工具。

相關閱讀:何時應該為 SVG 產生音訊波形?。