一個正確產生的音訊波形,是一張具確定性、在本機產生的 SVG,其欄位能恰好涵蓋每一個解碼後的取樣幀一次,其垂直中心位於所要求高度的一半,且其座標值來自已驗證的數字,並與您載入的音訊相符。「音訊波形產生器」會透過 Web Audio API,在當前的瀏覽器分頁中解碼該檔案,將解碼後的幀分割成「所要求寬度、1,000、解碼後幀數」中較小的桶數,每個桶繪製一條從最小值到最大值(皆經過夾限)且跨所有聲道的垂直 SVG 線條,並輸出一份可由相同輸入重現的純文字 SVG。若要正確產生音訊波形,您需先依編碼與大小限制驗證檔案、在允許範圍內設定寬度、高度與顏色、執行本機產生作業、讀取回報的幀數與欄數,然後開啟 SVG 文字檢查器,確認標記內容與您的輸入相符,再進行下載。略過其中任何一層,都會讓具確定性的結果變成事後無法驗證的猜測。

how do i make sure i generate audio waveform correctly
確認你能正確產生音訊波形

為峰值波形定義正確的輸出

對本工具而言,「正確」在第一次點擊之前就具有一個狹隘而重要的意義。這張圖是一個時域峰值包絡,而非頻譜圖,也非校準過的響度計。每個桶持有一段連續的整數索引範圍的解碼幀:第一個桶從第零幀開始,最後一個桶涵蓋至最後一個解碼幀,相鄰範圍之間不會略過任何可接受的幀。一道防禦性的夾限會將任何超出範圍或非有限的取樣值限制在 −1 到 1 之間。對多聲道音訊而言,同一桶內的最小值與最大值可能來自不同的聲道,因此這張圖是一個合併的峰值總覽,而非分開的左右兩軌——這是一項在實作文件中有記載、並於下文中再次強調的設計選擇。

以下說明這張圖實際編碼了什麼、以及明確未編碼什麼,以便讓「正確」能在每次執行時依同一份契約進行檢查。

圖片編碼的內容圖片未編碼的內容
每個桶的最小與最大取樣振幅頻率內容、頻譜圖的列數或音高
跨所有聲道、經夾限(−1 到 +1)的極值分別保留聲道身分的立體聲或多聲道軌道
在滿刻度峰值上下各保留固定的 5% 邊距校準過的響度、感知音量或重播時間點
由已驗證數字得出的確定性 SVG 座標節拍、音符、暫態或音樂結構
多聲道音訊的單一合併峰值總覽平均化或重寫過的音訊訊號

將這張圖當作成響度計、頻率分析儀或過載診斷工具,是使用者最常誤讀一張本來正確的 SVG 的方式。實作中明確不會計算頻率、節拍、音符、暫態、語音或音樂結構,而這道界線正是防止輸出在其他類別上悄悄出錯的關鍵。

可在產生前阻擋靜默失敗的檢查

通往正確結果的最快路徑,是拒絕本工具無法完整解碼的輸入。「音訊波形產生器」採用與本站其他音訊工具相同的解碼資料上限,而一個小的壓縮檔仍可能在解碼後展開為過大的浮點聲道陣列,因此僅憑壓縮後位元組上限並不足以保證成功。落在容許範圍之外的輸入會被整體拒絕,而非部分處理,這代表僅來自檔案開頭的部分波形永遠無法冒充代表完整輸入。

輸入維度可接受範圍
壓縮後檔案大小最大 50 MiB
解碼後時長最多 5 分鐘
聲道數1 到 8 個聲道
取樣率8,000 Hz 到 192,000 Hz
解碼後聲道-取樣總數最多 30,000,000
SVG 寬度320 到 1,600 像素
SVG 高度120 到 600 像素
背景與波形顏色瀏覽器色彩控制項提供的六位數十六進位值

依據 AudioBuffer 介面 規範,Web Audio 只會在當前瀏覽器與作業系統支援其真實編解碼時,才會讀取所選擇的 MP3、WAV、M4A、AAC、Ogg、WebM 或 FLAC。檔案副檔名或 MIME 標記並不能保證能解碼——不受支援、損壞、空的或偽裝的檔案會回傳錯誤而非降級的結果。選擇替代檔案、變更選項、重新產生,或離開頁面,皆會撤銷已失效的物件 URL,因此過期的預覽無法被當成新的輸入來使用。

使用音訊波形產生器來產生波形

依序操作此工具,每次都能產生具確定性的 SVG。

  1. 在能解碼您檔案格式的瀏覽器分頁中開啟音訊波形產生器。編解碼支援與否,取決於當前瀏覽器與作業系統,而非檔案副檔名或 MIME 標記。
  2. 從選擇器中挑選一個音訊檔——MP3、WAV、M4A、AAC、Ogg、WebM 或 FLAC——並在繼續前確認其不超過 50 MiB 的壓縮上限,以及 30,000,000 聲道-取樣的解碼額度。
  3. 使用頁面上的控制項,將 SVG 寬度設在 320 到 1,600 像素之間,高度設在 120 到 600 像素之間,然後從六位數十六進位的色彩選擇器中挑選背景與波形顏色。
  4. 點擊產生動作。本工具會在本機解碼檔案,將解碼後的幀分割成 min(寬度,1,000,幀數) 個整數索引桶,並為每個桶繪製一條跨所有聲道、由其夾限後最小值到夾限後最大值的垂直 SVG 線條。
  5. 讀取回報的解碼後幀數與峰值欄數。欄數等於桶數,且永遠不會超過 1,000,因此一段短片段無法憑空捏造出比其內容更多的獨立量測。
  6. 開啟 SVG 文字檢查器,確認其中包含一個背景矩形、一組數量等於回報欄數的峰值線條、您所設定的 viewBox 尺寸,以及您所選的正確顏色後,再點擊下載。

在點擊產生後確認輸出

產生後的驗證作業,是區分一張猜測 SVG 與一張已知良好 SVG 的關鍵。頁面會並列顯示解碼後的幀數與峰值欄數。欄數為「要求的影像寬度、1,000、解碼後幀數」中的較小值——三道獨立的上限來源,可在下載前先攔截靜默的損毀。若您在報告中看到的數字與該檔案理論上應有的內容不符,請先重新產生再下載。

一個實際算例可讓計算具體化:以一段 12 秒、單聲道、48,000 Hz 的檔案而言,解碼後的幀數為 12 × 48,000 = 576,000 幀。在要求寬度為 1,200 像素的情況下,欄數會變成 min(1,200, 1,000, 576,000) = 1,000。每個桶因此約包含 576,000 ÷ 1,000 = 576 個幀,並繪製於等距的水平中心點上。每個桶內的峰值線會從這 576 個幀的夾限後最小值延伸至其夾限後最大值。

SVG 文字檢查器會呈現將被儲存的完整字串。內容包含一個背景矩形以及一組峰值線條。SVG 座標具確定性:垂直中心為所要求高度的一半,滿刻度的正或負取樣會自該中心分別往上下延伸至高度的 45%,並在最高峰值之上與最低波谷之下各保留 5% 的邊距。各欄會在所要求寬度內等距置中,因此線條之間的間距為「寬度除以欄數」的函數。若檢查器文字與您所選的輸入有任何不符,即代表某個過期的物件 URL 尚未被撤銷——請以全新的檔案或選項變更重新產生並再次檢查。

由於下載檔案為純文字 SVG 而非 PNG、JPEG、影片或音訊,因此無論顯示尺寸為何皆能保持銳利,且可在任何支援 SVG 的編輯器中開啟。下載的 SVG 帶有固定的像素尺寸與相符的 viewBox,因此以其他尺寸重新顯示時能維持比例。需要不同線條粗細或更豐富來源資料的工作流程,仍可能需要另外的匯出路徑。

為何可重現性對正確產生至關重要

峰值波形只有在能被重現時才算正確。本實作中的 SVG 座標來自已驗證的數字與色彩選擇器,絕非來自檔名或內嵌的來源中繼資料,這正是賦予輸出確定性真實路徑的原因。在相同寬度、高度與顏色下,相同的解碼音訊會產生位元組完全相同的 SVG 文字——可用於跨執行的差異比對、不同版本錄音的比較,或在測試套件中釘住一筆結果。

可重現性同時能揭露靜默的錯誤。若同一檔案在未變更輸入的情況下,連續兩次產生不同的 SVG,代表本機環境在兩次執行之間發生了變動,新檔案應被視為未經驗證。本工具的處理流程皆在本機完成:Web Audio 讀取檔案、執行萃取、執行 SVG 產生、預覽與下載共用同一段字串,且不會將任何音訊檔案或產生的圖形上傳至 Lizely。若您的團隊需要就此點取得文件依據,音訊檔案與波形是否會上傳到伺服器?一文中的隱私說明對此有詳細的探討。

峰值波形同時也不是頻譜圖:時間由左至右推進,但垂直軸代表的是取樣振幅範圍,而非頻率。兩段錄音可能呈現相似的峰值卻聽起來截然不同,因為感知響度取決於時長、頻率平衡、動態與播放條件。請將此圖視為忠實的逐桶取樣包絡,並依據輸入(而非依據對音訊聽起來有多響的假設)加以驗證。

依序執行上述三個層級——輸入驗證、尺寸與顏色設定、產生後的 SVG 檢查——才能讓「正確產生」成為一個可重複的流程,而非一廂情願的期待。「音訊波形產生器」會保留每一個中介數值皆經驗證、每一個座標皆具確定性、每一份輸出皆可檢查,而這正是讓您在結果離開分頁前即可宣告其正確無誤的契約。

若想進一步了解,請參閱規劃產生音訊波形所需的步驟。