PerfectVector
Bởi Irene Kim

AutoTrace: Chuyển PNG thành SVG đường tâm

Chạy lệnh đường trung tâm của AutoTrace trên PNG, lưu SVG và kiểm tra thuộc tính nét, thuộc tính điền và các đường dẫn phụ mở của nó trước khi coi bản vẽ là một tuyến liên tục.

10 phút đọc
Trên trang này

Để chuyển đổi PNG thành SVG đường trung tâm bằng AutoTrace CLI độc lập, hãy thêm --centerline, yêu cầu đầu ra SVG và đặt tên cho tệp đã lưu. Sau đó kiểm tra hình học. Điều khiển AutoTrace 0.40.0 của chúng tôi đã tạo ra một đường dẫn được vẽ bằng nét SVG và không tô màu, nhưng một phần tử đường dẫn đó chứa hai đường dẫn phụ mở riêng biệt. Một số lượng nhỏ các phần tử đường dẫn SVG không phải là bằng chứng cho thấy đường vẽ là liên tục.

Thay vào đó, nếu một phần tác phẩm nghệ thuật của bạn cần các hình dạng có đường viền có tô màu, hãy bắt đầu miễn phí với PerfectVector và kiểm tra bóng và lỗ bên trong của bản xem trước. PerfectVector không tạo đường trung tâm. Bạn phải mở khóa kết quả trước khi có thể chỉnh sửa hoặc xuất kết quả đó. Đối với nhiệm vụ trung tâm, hãy sử dụng quy trình làm việc cục bộ hoàn chỉnh bên dưới.

Thử với hình ảnh của chính bạn
Mở công cụ đầy đủ
Dùng thử miễn phí. Thả ảnh vào để xem trước bản vector của bạn, không cần đăng ký.

Xác nhận bạn đang sử dụng AutoTrace CLI độc lập

Hướng dẫn này sử dụng tệp thực thi autotrace đã cài đặt được mô tả bởi dự án AutoTrace chính thức. AutoTracer.org là dịch vụ tải lên trình duyệt có giao diện riêng; điều khiển của nó không phải là các lệnh dưới đây. Giao diện đường trung tâm của Inkscape là một con đường khác để thực hiện nhiệm vụ. Hướng dẫn SVG vẽ thành một dòng bao gồm quy trình làm việc GUI, chuẩn bị nguồn, dọn dẹp và kiểm tra máy vẽ sau này.

Bạn cần cài đặt chương trình thực thi AutoTrace, thiết bị đầu cuối, PNG được phép và trình xem SVG hoặc trình soạn thảo văn bản thuần túy. Đặt một bản sao làm việc có tên line-control.png vào một thư mục riêng và giữ nguyên bản gốc. Tài liệu tham khảo thử nghiệm của chúng tôi là 160 × 120 RGB PNG được tạo ra có mục đích: một thân dọc dày màu đen với hai thanh bên phải trên nền trắng đục.

Kiểm tra bản dựng đã cài đặt của bạn trước khi truy tìm:

autotrace --version
autotrace --help
autotrace --list-input-formats
autotrace --list-output-formats

Phiên bản của chúng tôi trả về AutoTrace version 0.40.0. Danh sách định dạng của nó bao gồm đầu vào PNG và đầu ra SVG. Dự án lưu ý rằng việc hỗ trợ định dạng phụ thuộc vào bản dựng. Nếu PNG bị thiếu trong danh sách đầu vào thực tế của bạn, hãy giải quyết hỗ trợ đầu vào của bản dựng đó trước khi sao chép lệnh chuyển đổi.

1. Lưu SVG tham chiếu theo phác thảo

Đầu tiên hãy lưu dấu vết thông thường dưới tên tệp riêng của nó:

autotrace --background-color FFFFFF \
  --output-format svg --output-file outline.svg line-control.png

Hướng dẫn sử dụng lệnh của người bảo trì ghi lại màu nền dưới dạng màu thập lục phân cần bỏ qua và các tùy chọn đầu ra dưới dạng định dạng được yêu cầu và tệp đích. FFFFFF xác định màu trắng ở đây. Giữ lựa chọn đó gắn liền với nguồn của bạn thay vì thêm nó vào mọi hình ảnh một cách mù quáng.

outline.svg thực tế chứa một đường dẫn khép kín với fill:#000000; stroke:none;. Nó mô tả ranh giới của vùng đen dày đặc. Để có giải thích rộng hơn về nghệ thuật vẽ đường vẽ được thể hiện bằng các hình tô màu, hãy xem nghệ thuật vẽ nét tới SVG.

2. Thêm đường trung tâm và lưu SVG riêng

Chạy cùng một nguồn với tùy chọn đường trung tâm và tên tệp đầu ra mới:

autotrace --background-color FFFFFF \
  --output-format svg --output-file centerline.svg \
  --centerline line-control.png

Dự án chính thức và sổ tay hướng dẫn phân biệt việc dò tìm đường trung tâm với việc dò tìm đường viền. centerline.svg đã lưu của chúng tôi có stroke:#000000; fill:none;, một phần tử đường dẫn và không có phần tử hình ảnh. Hình dạng của nó đi theo các đường mỏng xuyên qua các vùng dày của nguồn thay vì lấp đầy hình dạng ranh giới của chúng.

Chúng tôi cũng đã thử nghiệm cùng một nguồn mà không có tùy chọn nền trắng rõ ràng:

autotrace --centerline --output-format svg \
  --output-file centerline-background-retained.svg line-control.png

Tệp đó giống hệt từng byte với centerline.svg trong tài liệu tham khảo thử nghiệm này. Do đó, cờ nền rõ ràng là không cần thiết cho nguồn và bản dựng này. Đừng coi nó như một cách sửa chữa chung cho các nhánh bị thiếu hoặc một lời giải thích cho mọi kết quả cơ bản.

3. Kiểm tra các tuyến đường đã lưu, không chỉ số lượng đường đi

Đây là những quan sát từ ba tệp đã lưu thực tế, được kiểm tra dưới dạng đánh dấu SVG và được hiển thị cục bộ. Các tập tin được giữ lại từ quá trình kiểm tra dòng lệnh ban đầu của chúng tôi; quá trình kiểm tra đã sử dụng lại các kết quả đầu ra đó và chúng tôi không khẳng định rằng chúng tôi đã thực hiện lần chạy chuyển đổi thứ hai.

Tệp đã lưuCác phần tử đường dẫnSơn và đóng cửaNhững gì nó thiết lập
outline.svgMộtMàu đen, không có nét; một đường dẫn phụ đóngMột dấu vết ranh giới đầy thông thường
centerline.svgMộtnét đen, không tô màu; hai đường dẫn phụ mởHình học đường tâm có khoảng trống trên đường vẽ
centerline-background-retained.svgMộtCác byte giống hệt với tệp đường trung tâmViệc bỏ tùy chọn nền không có gì khác biệt ở đây

đường dẫn phụ là đường viền riêng biệt bên trong phần tử đường dẫn. Trong dữ liệu đường dẫn SVG, M bắt đầu một đường dẫn phụ và Z đóng nó, như được xác định trong Đặc tả đường dẫn SVG. Đường trung tâm của chúng tôi có hai lệnh M và không có lệnh Z. Dữ liệu đã lưu có liên quan, có thêm khoảng trắng để đọc, là:

M30 30L30 75
C30 80.0707 28.3961 88.5616 31.6034 92.8519
C35.7319 98.3743 47.9272 96 54 96L117 96
M31 56L87 56

Tuyến đầu tiên bắt đầu dọc theo một thân thẳng đứng tại x = 30. Tuyến thứ hai bắt đầu tại x = 31, y = 56. Sự bắt đầu riêng biệt đó không phải là bằng chứng của một nhánh đã nối. Ngay cả đầu vào đơn giản này cũng cần kiểm tra điểm cuối trước khi bất kỳ ai coi nó là một tuyến đường liên tục.

Hình minh họa
Tài liệu đường dẫn khái niệm chứa các đường cong mở riêng biệt với các điểm cuối và khoảng cách phóng to
Kiểm tra điểm cuối và khoảng trống trong đường vẽ trong đối tượng đường dẫn đã lưu.

Mở SVG bên cạnh nguồn. Kiểm tra thân chính, từng nhánh bên, điểm cuối và các vòng lặp không mong muốn. Sử dụng các thuộc tính nét/điền đã lưu và dữ liệu đường dẫn để trả lời các câu hỏi về cấu trúc; riêng một bản xem trước trông mỏng có thể ẩn một đường viền đầy màu sắc hoặc một nhánh bị ngắt kết nối. Những kiểm tra này xác minh nội dung tập tin. Họ không xác minh việc nhập thành công hoặc vẽ biểu đồ bằng bút trong một công cụ khác.

Khôi phục từ lần kiểm tra thất bại

Kiểm tra không thành côngHành động tiếp theo
PNG bị từ chốiKiểm tra danh sách định dạng đầu vào đã cài đặt và các phần phụ thuộc của bản dựng đó
SVG vẫn là một hình dạng khép kínXác nhận --centerline đã được sử dụng và kiểm tra kết quả đầu ra mới được đặt tên thay vì SVG tham chiếu được theo dõi phác thảo
Đường đi rất khó nhìnKiểm tra nét và tô màu của nó, sau đó chọn nền trình xem tương phản
Một nhánh bị thiếu hoặc tách raXem lại nguồn, kiểm tra điểm cuối và sửa chữa tuyến đường một cách có chủ ý
Một đường dẫn đang được coi là một đường liên tụcKiểm tra các lần khởi động M riêng biệt và các kết nối thực tế trong phần tử đó

Giữ SVG được chấp nhận với PNG gốc, phiên bản AutoTrace và lệnh đầy đủ. Kiểm tra hoàn thành cho nhiệm vụ CLI này là một SVG đã lưu với các đường dẫn vẽ dự định được biểu thị bằng các nét SVG và các điểm ngắt được kiểm tra. Chúng tôi không thử nghiệm ứng dụng nhận, chỉnh sửa gốc, vẽ bằng bút vật lý hoặc cắt vật lý. Sử dụng kiểm tra bản vẽ và dọn dẹp của hướng dẫn vẽ một dòng cho những quyết định tiếp theo; truy tìm tự động không phải là bằng chứng cho việc tái thiết chi nhánh hoàn hảo.

Nếu một phần riêng biệt của dự án yêu cầu các hình khối có nền màu, hãy bắt đầu miễn phí với PerfectVector và so sánh các hình dạng bên ngoài và lỗ bên trong của bản xem trước với nguồn của bạn. Giữ phần đường trung tâm trong quy trình làm việc có khả năng thực hiện đường trung tâm.

Câu hỏi thường gặp

Lệnh AutoTrace dành cho đường trung tâm PNG đến SVG là gì?

Sử dụng autotrace với --centerline, --output-format svg, đích --output-file và đầu vào PNG. Trước tiên hãy kiểm tra phiên bản đã cài đặt và các định dạng đầu vào được hỗ trợ, sau đó kiểm tra nét, tô và định tuyến của SVG đã lưu.

Một đường dẫn SVG có luôn là một đường tâm liên tục không?

Không. Một phần tử đường dẫn có thể chứa nhiều đường dẫn phụ. SVG đường trung tâm thực tế của chúng tôi có một phần tử đường dẫn nhưng có hai đường dẫn phụ mở, do đó, chỉ riêng số phần tử không chứng minh được một tuyến đường liên tục.

Có cần tùy chọn nền trắng không?

Nó không bắt buộc đối với hình ảnh thử nghiệm nền trắng của chúng tôi trong AutoTrace 0.40.0: việc bỏ qua nó sẽ tạo ra các byte SVG giống hệt nhau. Chọn xử lý nền cho nguồn và bản dựng đã cài đặt của bạn thay vì cho rằng nó sửa chữa hình dạng đường tâm.

PerfectVector có thể tạo ra đường tâm giống nhau không?

PerfectVector tạo các hình dạng vector có đường viền với màu tô thay vì đường trung tâm. Nó có thể phục vụ một nhiệm vụ có hình dạng đầy riêng biệt, trong khi các điểm cần đường đi qua phần giữa của chúng yêu cầu một công cụ có khả năng tạo đường tâm hoặc vẽ có chủ ý.

Nguồn

  1. Dự án AutoTrace chính thức — CLI độc lập, hỗ trợ đường trung tâm, cách sử dụng và các định dạng đầu vào phụ thuộc vào bản dựng.
  2. Hướng dẫn sử dụng lệnh AutoTrace — các tùy chọn đường trung tâm, nền, tệp đầu ra và định dạng đầu ra.
  3. Đặc tả đường dẫn SVG W3C — đường dẫn phụ, lệnh moveto và đóng.
  4. AutoTracer.org — dịch vụ trình duyệt riêng biệt được phân biệt với CLI đã cài đặt.

Thêm từ blog

PerfectVector

Biến hình ảnh thành
đường vector gọn sạch, dễ chỉnh sửa

Vector hóa và kiểm tra bản xem trước miễn phí, không giới hạn theo ngày.