PNG 轉換 SVG 向量化
將 PNG 或 JPG 點陣圖形轉換為可縮放的 SVG 向量圖。完全在您的瀏覽器中進行安全且快速的處理。
將 PNG/JPG 拖曳至此
支援最高 50MB
將 PNG 或 JPG 點陣圖形轉換為可縮放的 SVG 向量圖。完全在您的瀏覽器中進行安全且快速的處理。
支援最高 50MB
將 PNG 轉換為 SVG 從根本上來說是一個追蹤操作,而不是格式變更。 PNG儲存像素; SVG 儲存幾何圖元。從像素網格到可縮放向量路徑需要解釋位圖並在相似顏色的區域周圍繪製近似形狀。結果是真正可擴展的——您可以自由調整大小而不會出現像素化——但它並不是原始程式碼的完美再現。攝影內容的追蹤效果很差,因為每個像素級的顏色變化都會變成一個形狀,產生巨大的 SVG,無法達到目的。標誌、圖標、藝術線條和高對比度圖形的描跡清晰,因為它們具有少量且邊界明確的顏色區域。
該轉換器使用 imagetracerjs 庫,這是一個類似於 potrace 的向量追蹤演算法的 JavaScript 連接埠。 PNG 被解碼為 RGBA 點圖,使用可配置調色板將點陣圖分割為顏色區域,將每個區域的邊界追蹤為路徑,使用貝塞爾近似簡化路徑,並將生成的路徑作為 SVG 路徑元素發出。整個管道在您的瀏覽器中運行,無需任何伺服器上傳。
追蹤參數控制保真度和檔案大小之間的權衡。更多的顏色和更精細的細節會產生更大的 SVG,與來源更加匹配;更少的顏色和更粗糙的描畫會產生更小的 SVG,並具有更風格化的感覺。徽標和圖示的預設值已調整;複雜的圖像可能會受益於調整設定的追蹤通道,或者可能根本不適合向量化。
當您需要將圖像縮放到超出其原始解析度時,向量化 PNG 最有用。尤其是徽標,通常以適中尺寸的 PNG 形式出現,並且需要在廣告看板、視網膜顯示器和大幅面印刷品上顯得清晰。向量軌跡產生的 SVG 可以在不損失品質的情況下進行縮放;權衡是對原始像素的保真度。
對於顏色較少且平坦區域較大的圖形,SVG 也比 PNG 更緊湊。 256×256 的 PNG 圖示可能為 8 KB;具有兩種或三種顏色的等效 SVG 通常小於 1 KB。對於交付到 Web 前端的 UI 圖示庫,向量版本可縮小套件大小並提高所有顯示密度的清晰度。
拖放 PNG,選擇追蹤設置,產生 SVG。
imagetracerjs 實現了多級管道:顏色量化使用 k 均值聚類或中值切割將位圖減少為固定數量的顏色;邊緣檢測識別區域之間的像素邊界;輪廓追踪沿著邊界產生閉合多邊形;直線和曲線擬合用貝塞爾曲線逼近多邊形以減少路徑數據。
最重要的演算法參數是顏色數量(典型值:4-32)、pathomit(比這麼多像素短的路徑將作為噪聲被丟棄)、ltres(線容差 - 邊緣在分割成新段之前可以偏離多遠)和 qtres(二次曲線容差 - 曲線平滑的程度)。預設值適用於徽標;複雜的圖像受益於每個圖像的調整。
輸出是帶有路徑元素的標準 SVG 1.1。每個顏色區域都成為具有填滿屬性的一條路徑。產生的檔案可以在任何瀏覽器、向量編輯器或支援 SVG 的設計工具中開啟。檔案大小主要取決於路徑數和節點密度;典型的追蹤徽標為 1–10 KB。