Cách sử dụng
- Dán chuỗi Base64 hoặc URI data:image/svg+xml;base64.
- Kiểm tra bản xem trước cùng định dạng và kích thước phát hiện được.
- Giữ SVG ở mục Tải xuống dạng. Với đầu vào là SVG, tệp được lưu dưới dạng văn bản SVG.
- Tải xuống tệp .svg và mở bằng trình soạn thảo nếu bạn muốn đọc hoặc chỉnh sửa mã.
Tìm SVG bên trong Base64
Khác với các định dạng ảnh khác, SVG là văn bản XML thuần. Một tệp bắt đầu bằng <svg sẽ được mã hóa thành Base64 bắt đầu bằng PHN2Zy, còn tệp bắt đầu bằng khai báo XML (<?xml) sẽ cho chuỗi bắt đầu bằng PD94bWwg. SVG dạng Base64 thường gặp trong ảnh nền CSS, bộ biểu tượng, bản xuất từ công cụ thiết kế và mẫu email. Kiểu MIME là image/svg+xml.
Nhiều data URI SVG hoàn toàn không phải Base64 mà là văn bản mã hóa phần trăm, chẳng hạn data:image/svg+xml,%3Csvg.... Công cụ này cần Base64, vì vậy hãy phân tích những chuỗi đó bằng công cụ Tạo Data URI.
Đọc mã SVG
Bản xem trước cho thấy hình được hiển thị ra sao, nhưng phần đáng chú ý thường là mã: dữ liệu đường dẫn (path), màu sắc, viewBox hay phông chữ nhúng. Hãy tải tệp xuống dạng Bản gốc hoặc SVG rồi mở bằng bất kỳ trình soạn thảo văn bản nào, hoặc dán cùng chuỗi Base64 vào Giải mã Base64 để xem ngay XML dưới dạng văn bản.
Raster sang SVG chỉ là lớp bọc, không phải vector hóa
Nếu dữ liệu Base64 là PNG, JPEG hoặc một ảnh bitmap khác, chọn SVG sẽ tạo ra tệp SVG chứa các điểm ảnh gốc trong một phần tử <image>. Cách này hữu ích khi một công cụ chỉ nhận tệp SVG, nhưng ảnh không được vẽ lại thành các hình: ảnh vẫn bị mờ khi phóng to, và tệp lớn hơn ảnh bitmap vì các điểm ảnh được lưu dưới dạng Base64 bên trong. Để có đường vector thực sự, hãy dùng phần mềm vector hóa như Potrace hoặc tính năng Trace Bitmap trong Inkscape.
Xử lý SVG từ nguồn không đáng tin cậy
SVG có thể chứa phần tử <script>, thuộc tính xử lý sự kiện và liên kết đến tài nguyên bên ngoài. Trình duyệt chặn tất cả những thứ này khi SVG được hiển thị như một ảnh, qua thẻ <img> hoặc nền CSS. Script có thể chạy và tài nguyên bên ngoài có thể được tải khi tệp được mở trực tiếp trong một thẻ trình duyệt hoặc khi mã của nó được dán trực tiếp vào trang. Hãy xem xét hoặc làm sạch SVG từ nguồn không rõ trước khi dùng theo cách đó.
Câu hỏi thường gặp
Công cụ này có biến PNG thành SVG vector thực sự không?
Không. Chuyển ảnh bitmap sang SVG chỉ nhúng ảnh vào bên trong một tệp SVG. Kết quả co giãn giống ảnh bitmap gốc, không giống hình vẽ vector.
Vì sao data URI SVG của tôi không giải mã được?
;base64, không. Nếu không, SVG đó được mã hóa phần trăm hoặc là văn bản thô chứ không phải Base64. Công cụ Tạo Data URI có thể phân tích nó.Giải mã SVG từ nguồn không rõ có an toàn không?
Giải mã và lưu lại thì vô hại, vì kết quả chỉ là văn bản. Script bên trong SVG chỉ có thể chạy khi SVG được mở như một tài liệu hoặc được chèn trực tiếp vào trang web.
Vì sao phông chữ hoặc ảnh liên kết bị mất sau khi chuyển SVG sang PNG?
Để raster hóa SVG, trình duyệt tải nó như một ảnh, và ở chế độ đó SVG không thể tải tệp bên ngoài. Phông chữ web và ảnh liên kết bị bỏ qua, phông chữ mặc định được dùng thay thế. Hãy nhúng phông chữ và ảnh vào SVG để tệp tự chứa đầy đủ.