Xuất SVG từ Illustrator CC làm biến dạng đường dẫn


8

Tôi đang cố gắng tạo một số biểu tượng để thêm vào thư viện Glyphicons.

Tôi đã tạo chúng bằng công cụ bút (hình dạng) trong Adobe Illustrator CC, chúng cực kỳ cơ bản. Như PNG, hoặc EPS họ xuất khẩu tốt. Thật không may, tôi cần xuất SVG để sử dụng với Glyphicons.

Khi tôi xuất sang SVG, các hình dạng dường như di chuyển xung quanh. Ít nhất là họ không còn như họ xuất hiện trên màn hình của tôi.

Làm thế nào tôi có thể làm cho chúng xuất hiện như họ làm trong họa sĩ minh họa?

Đây là một PNG từ bên trong họa sĩ minh họa. nhập mô tả hình ảnh ở đây

Đây là một PNG từ xem trước, đây là SVG. Các hình dạng được sắp xếp rõ ràng khác nhau.

Rõ ràng các hình dạng đang trở nên sai lệch sau khi xuất khẩu, có bất kỳ lý do rõ ràng cho điều này? Tất cả các cài đặt xuất của tôi được đặt làm mặc định.


bạn có thể cung cấp một số thông tin chi tiết về cách hình học được tạo ra bất kỳ cơ hội nào cho một hình ảnh trong đó tất cả các đối tượng được chọn để xem các neo. Ngoài ra đối với số tròn sử dụng lưới
joojaa

Câu trả lời:


15

Thay đổi "Vị trí thập phân" thành 3 trong hộp thoại "Tùy chọn SVG" xuất hiện khi lưu dưới dạng SVG:

ảnh chụp màn hình


1

Đây là một lỗi phổ biến trong tệp .SVG .. đó là do các đường cong cứng (các đường cong được làm chỉ bằng hai neo và tay cầm dài) không thể được trình duyệt hiển thị tốt.

Điều tốt nhất để làm là chia đường dẫn của bạn thành các phân đoạn nhỏ hơn, đặc biệt là xung quanh mỏ neo có vấn đề.

Chỉ cần đi đến Object > Path > Add Anchor Points


Điều đó dường như không có bất kỳ ảnh hưởng nào cả. Ngoài ra, tôi đọc được ở đâu đó rằng bạn nên cố gắng giữ số điểm neo tối thiểu có thể để giúp thời gian tải để kết xuất SVG trên thiết bị di động. Là tổng số vô nghĩa, hoặc nó là một loại hành động cân bằng?
Andrew Peachey

0

Tôi có xu hướng nhận được kết quả tốt nhất từ ​​lưu SVG của mình khi tọa độ của các đối tượng của tôi có giá trị thập phân sạch. Ví dụ: một đối tượng tại X = 100.452 sẽ được chuyển sang X = 100.5. Tôi đã trải qua các chuyển động nhẹ tương tự như vấn đề của bạn khi để các đối tượng ở tọa độ với các phần phân đoạn lộn xộn.


Thật thú vị, làm thế nào để bạn đạt được điều đó. Phải là một nỗi đau đúng để định vị công cụ chính xác như vậy?
Andrew Peachey

@AndrewPeachey Không khó lắm. Chỉ cần nhấp vào đối tượng và nhấp vào mũi tên lên hoặc xuống bên cạnh vị trí để làm cho nó tròn sang số tiếp theo.
Alan

Ah. Tất nhiên. Có ý nghĩa. Chúc mừng, sẽ điều tra.
Andrew Peachey

Nếu bạn đang tạo hiệu ứng cho một SVG, điều này sẽ tăng tốc độ lên, giữ chúng trên một pixel. Nó khó hơn cho máy tính để crunch số dấu phẩy động. Và khó hơn để hiển thị để đoán nếu nó nên 1 pixel ở bên trái hoặc bên phải.
Lex

0

Giải pháp tìm thấy.

Đây rõ ràng không phải là giải pháp tốt nhất, sạch nhất đẹp nhất nhưng nó hoạt động rất tốt.

Quy trình của tôi:
1. Vẽ biểu tượng trong Illustrator
2. Lưu dưới dạng tệp .ai
3. Mở .ai trong OSX iDraw
4. Xuất sang SVG từ iDraw

Giải pháp đơn giản:
1. Vẽ biểu tượng trong iDraw
2. Xuất sang SVG từ iDraw

Tôi hy vọng điều này sẽ giúp những người khác


0

Tôi cũng gặp khó khăn khi xuất khẩu và đã thử:

File> Save as

thay vì:

File> Export> Export as.

Và đó dường như là một mánh khóe!


-1

Khi tôi phát hiện ra sự cố này chỉ xuất hiện nếu bạn xuất "chỉ được chọn". Khi nhà xuất khẩu không nhìn thấy đường viền (trang), nó tạo ra một cái gì đó sai với các đường cong.

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.