PNG görüntüsünü SVG'ye nasıl dönüştürebilirim? [kapalı]


266

PNG görüntüsünü SVG'ye nasıl dönüştürebilirim?


21
Programlı mı değil mi? Hangi dil, platform?
Michael Petrotta

Bazı uygulamalarla mı yoksa İşletim sistemi komutlarıyla mı? Eğer işletim sistemi aracılığıyla hangi işletim sistemi söyleyebilir misiniz .. Teşekkürler
Mahesh Velaga

Yanıtlar:


130

Resminizi yükleyebileceğiniz ve sonucu görebileceğiniz bir web sitesi var.

http://vectormagic.com/home

Ancak svg resminizi indirmek istiyorsanız, kayıt olmanız gerekir. (Kayıt olursanız, ücretsiz 2 resim alırsınız)


122

potraceyok PNG desteklemez girdi dosyası, ancak PNM .
Bu nedenle, önce convertPNG'den PNM'ye:

convert file.png file.pnm        # PNG to PNM
potrace file.pnm -s -o file.svg  # PNM to SVG

Seçenekleri açıklama

  • potrace -s=> Çıktı dosyası S VG
  • potrace -o file.svg => Çıktıya yaz file.svg

Misal

Girdi dosyası = 2017.png Giriş dosyası

convert 2017.png 2017.pnm

Geçici dosya = 2017.pnm

potrace 2017.pnm -s -o 2017.svg

Çıktı dosyası = 2017.svg Çıktı dosyası

Senaryo

ykarikos bir senaryo önermektedir png2svg.sh ben düzeldi:

#!/bin/bash

File_png="${1?:Usage: $0 file.png}"

if [[ ! -s "$File_png" ]]; then
  echo >&2 "The first argument ($File_png)"
  echo >&2 "must be a file having a size greater than zero"
  ( set -x ; ls -s "$File_png" )
  exit 1
fi

File="${File_png%.*}"

convert "$File_png" "$File.pnm"        # PNG to PNM
potrace "$File.pnm" -s -o "$File.svg"  # PNM to SVG
rm "$File.pnm"                         # Remove PNM

Tek satırlık komut

Çok sayıda dosyayı dönüştürmek istiyorsanız, aşağıdaki tek satırlık komutu da kullanabilirsiniz:

( set -x ; for f_png in *.png ; do f="${f_png%.png}" ; convert "$f_png" "$f.pnm" && potrace "$f.pnm" -s -o "$f.svg" ; done )

Ayrıca bakınız

Vikipedi'de raster-vektör dönüştürücülerin bu iyi karşılaştırmasına da bakın .


2
Potrace kullanılarak pnm'den svg'ye dönüştürüldüğünde görüntü renk kaybeder. Rengi korumanın bir yolu var mı?
Kodlayıcı

1
Merhaba @mundella. Her zaman potracesiyah beyaz simgeler için kullandım . Geri bildiriminiz için teşekkürler. Ama üzgünüm renkleri nasıl koruyacağımız hakkında hiçbir fikrim yok ... Ho! Bir fikrim var: Orijinal görüntünüzde birkaç renk varsa (diyelim ki üç benzersiz renk), üç başlangıç ​​resmi oluşturabilirsiniz (her renk için bir tane). Ardından SVG'ye dönüştürün. Ve son olarak, üç SVG içeriğini bir dosyada birleştirin (SVG XML tabanlıdır). Umarım bu yardımcı olabilir ... Şerefe ;-)
olibre

@olibre pragmatically aynı şeyleri yapmak herhangi bir platform var mı
Ami Kamboj

1
Merhaba @AmiKamboj. Sorunuzu anladığınızdan emin değilim. Komutlar convertve potracebirçok platformda kullanılabilir. Linux tabanlı bilgisayarlar kullanıyorum. Bu komutları dün taranmış bir kağıttan SVG üretmek için kullandım. Sonucu görebilirsiniz: cpp-frug.github.io/images/Cpp-President-2017.svg Lütfen hedefiniz hakkında daha fazla bilgi verin. Ne istiyorsun / merak ediyorsun? İhtiyacınız / isteğiniz nedir? Şerefe ;-)
olibre

1
Ben hemen hemen her çevrimiçi x svg dönüştürücü orada kullandım. Potrace npm paketi hepsini sudan havaya uçurdu. Bu harika.
tsteve

59

PNG, bir bitmap görüntü stili ve SVG, bitmap'leri destekleyen vektör tabanlı bir grafik tasarımdır, bu yüzden görüntüyü vektörlere dönüştürecek gibi değil, sadece vektör tabanlı bir formatta gömülü bir görüntüdür. Bunu http://www.inkscape.org/ adresini kullanarak ücretsiz yapabilirsiniz. Gömecektir, ancak isterseniz (potrace kullanarak) yollara dönüştürmeye çalışacak olan Canlı İz gibi bir motora da sahiptir. Adobe Illustrator'da (Ticari) canlı izlemeye bakın bir örnek:

http://graphicssoft.about.com/od/illustrator/ss/sflivetrace.htm


1
Inkscape'teki canlı izleri, kayıp orijinalleri olan logoları yeniden oluşturmak için kullandım. En son sürüm bazı iyileştirmeler yapmadığı sürece, biraz vur ya da özledim. Bunu söyledikten sonra, Inkscape'teki bazı logoları manuel olarak izledim ve oldukça iyi başardım.
AnonJr

12
Inkscape'de bunu nasıl yapacağınızla ilgili bir açıklama: wiki.inkscape.org/wiki/index.php/Potrace
Erel Segal-Halevi

harika yorum. Chrome ile ilgili bir sorun olmasa da iOS 7.1 Safari'nin svg'lerde gömülü görüntüleri göstermeyeceğini fark ettik
SorunlarOfSumit

28

1
Bu Potrace nasıl kullanılacağını bildiğinizde çok doğrudur: ama çok renkli değil 1.) dosyanızı BMP 2'ye dönüştürün.) (doğru bölüm için) bmp'yi yüksek çözünürlüğe dönüştürün (strech) 3.) şekilleri renklendirin Eğer siyah izlemek istiyorum 4.) dönüştürmek 5.) genişliği ve yüksekliği orijinaline değiştirmek 6.) doğru izleme takdir.
PauAI

18

Kolay

  1. Inkscape'i indirin (tamamen ücretsiz)
  2. Bu kısa youtube videosundaki talimatları izleyin

Gördüğünüz gibi, bir sürü diğer zeki .svg şeyler yapmak istiyorsanız, Inkscape'i kullanarak da yapabilirsiniz.

Teknik olmayan bir gözlem: Şahsen bu yöntemi "ücretsiz" web sitesi teklifleri yerine tercih ederim, çünkü çoğu zaman kayıt gerektirmenin yanı sıra, görüntüyü yükleyerek, tüm pratik terimlerle, resmi web sitesi sahibine veriyor.


1
Neden inişli çıkışlı? Bu yaklaşımı çok başarılı bir şekilde kullanıyorum. En azından insanların neden anlayışlarınızdan yararlanabilmelerini açıklamak için nezaket sahibi olun.
Pancho

5
Bu talimatları izleyerek görüntüyü yalnızca SVG XML ile sarar - hiçbir şeyi yol verilerine dönüştürmez.
Robert

@Robert - bilgi için teşekkürler, benim amaçlar için iyi çalıştı mutlulukla cahil oldu. Ancak bu, Inkscape'in eksiksiz bir PNG'den SVG'ye dönüşüm gerçekleştirebildiğinden ve çok daha fazlasından uzaklaşmaz. İlgilenen herkesi göstermek için cevabımı kısa bir açıklayıcı video klip içerecek şekilde değiştirdim.
Pancho

Gerçekten öyle mi? Oluşturulan SVG'yi kontrol ettim ve mobilefish yönteminden farklı olarak yol verisi var gibi görünüyor ...
dario_ramos

Haklı bir neden olmadan zaman zaman bunu aşağıya düşüren bazı insanlar var ve kötü niyetli olduğu fikrini oluşturmaya başlıyorum. Gerçekten bir sebep varsa - sorun değil, tembel olmayı bırakın ve sağlayarak bu topluluğa bir değer katın.
Pancho

15

Adobe Illustrator ile:

Adobe Illustrator uygulamasını açın. "Dosya" yı tıklayın ve .PNG dosyasını programa yüklemek için "Aç" ı seçin. Bir .SVG dosyası olarak kaydetmeden önce görüntüyü gerektiği gibi düzenleyin. "Dosya" yı tıklayın ve "Farklı Kaydet" i seçin. Yeni bir dosya adı oluşturun veya mevcut adı kullanın. Seçilen dosya türünün SVG olduğundan emin olun. Bir dizin seçin ve dosyayı kaydetmek için "Kaydet" i tıklayın.

veya

çevrimiçi dönüştürücü http://image.online-convert.com/convert-to-svg

AI'yı tercih ederim çünkü gerekli değişiklikleri yapabilirsiniz

iyi şanslar


3
Online-convert.com için +1. Şimdi tek renkli siluetleri bir çift ile denedim .. kusursuz bir şekilde gerçekleştirilen .. Ayrıca tamamen ücretsiz gibi görünüyor.
nedR

Evet daha iyi dönüştürücülerden biri ... Teşekkürler
JayD

1
Illustrator'ın bunu pişirdiğini fark etmedim. Her şey zaten .ai olarak sahip olmak, bana bir ton zaman kazandıracak.
Doyle Lewis

10

Benim için sürpriz, ortaya çıkan potrace , sadece siyah ve beyazı işleyebilir. Bu, durumunuzu kullanmanız için iyi olabilir, ancak bazıları renk izleme eksikliğinin sorunlu olduğunu düşünebilir.

Şahsen, Vector Magic ile tatmin edici sonuçlar elde ettim

Yine de mükemmel değil.


9

Kullananlara bir not Potrace ve imagemagick dönüştürerek, PNG şeffaflık ile görüntüleri PPM çok iyi işe görünmüyor. İşte bunu ele almak için -flattenbayrağını kullanan bir örnek convert:

sudo apt-get install potrace imagemagick
convert -flatten input.png output.ppm
potrace -s output.ppm -o output.svg
rm output.ppm

Bir başka ilginç olgu da giriş biçimi olarak PPM (256 * 3 renk, yani RGB), PGM (256 renk, yani gri tonlama) veya PBM (2 renk, yani yalnızca beyaz veya siyah) kullanabilmenizdir. Sınırlı gözlemlerimden, kenar yumuşatılmış görüntülerde PPM ve PGM ( görebildiğim kadarıyla aynı SVG'ler üreten ) renkli alanı küçültür ve PBM renkli alanı genişletir (sadece biraz da olsa). Muhtemelen bu bir pixel > (256 / 2)test ile test arasındaki farktır pixel > 0. Örneğin, dosya uzantısını değiştirerek bu üç dosya arasında geçiş yapabilirsiniz. aşağıdaki PBM kullanın :

sudo apt-get install potrace imagemagick
convert -flatten input.png output.pbm
potrace -s output.pbm -o output.svg
rm output.pbm

7

Ayrıca http://image.online-convert.com/convert-to-svg adresini de deneyebilirsiniz.

Her zaman ihtiyaçlarım için kullanıyorum.


Comlex görüntülerde bile cazibe gibi çalışıyorum. Bu aracı gerçekten tavsiye ediyorum.
Atıfcan Ergin

Ne yazık ki benim için çalışmadı.
adamj

Resmin şeffaflığı varsa iyi çalışmıyor
Genaut

Senaryonun kendinizin bir fotoğrafını çekmesini ve sonuç olarak mükemmel bir katmanlı SVG elde etmesini bekleyemezsiniz, böyle bir şey yoktur. Basit bir şekle sahipseniz ve yol (lar) ı almak istiyorsanız, bunu yapar. Bu sayfa ile bir çok yazı tipi simgesi yaptım ve asla benim için başarısız oldum.
thednp

@thednp resmim siyah beyaz çıktı
iOSAndroidWindowsMobileAppsDev

7

Bu soruyu ve cevapları aynı şeyi yapmaya çalışırken buldum! Bahsedilen diğer araçlardan bazılarını kullanmak istemedim. (E-postamı vermek istemiyorum ve ödemek istemiyorum). Inkscape'in (v0.91) oldukça iyi bir iş yapabileceğini buldum. Bu eğitim hızlı ve anlaşılması kolaydır.

Inkskape ve Shift + Alt + B'de bitmap'inizi seçmek kadar basit .

Potrace tabanlı Inksape Trace bitmap aracı ile Kenar Tespiti


4

Neden .png'den .svg'ye dönüştürmek istediğinize bağlı olarak , sorundan geçmeniz gerekmeyebilir. .Png (raster) 'dan .svg (vector)' ya dönüştürmek, mevcut araçlara çok aşina değilseniz veya ticari olarak bir grafik tasarımcı değilseniz.

Birisi size büyük, yüksek çözünürlüklü bir dosya (ör. 1024x1024) gönderirse, GIMP'de istediğiniz herhangi bir boyuta yeniden boyutlandırabilirsiniz. Genellikle, çözünürlük (inç başına düşen piksel sayısı) çok düşükse görüntüyü yeniden boyutlandırmada sorun yaşarsınız. Bunu GIMP'de düzeltmek için şunları yapabilirsiniz:

  1. File -> Open: .png dosyanız
  2. Image -> Image Properties: özünürlüğü ve renk uzayını kontrol edin. 300 ppi civarında bir çözünürlük istiyorsunuz. Çoğu durumda renk uzayının RGB olmasını istersiniz.
  3. Image -> Mode: RGB olarak ayarlandı
  4. Image -> Scale Image: boyutu yalnız bırakın, Y çözünürlüğünü 300 veya daha yüksek bir değere ayarlayın. Ölçeği Vur.
  5. Image -> Scale Image: çözünürlük şimdi 300 olmalıdır ve artık görüntüyü hemen hemen istediğiniz boyuta göre yeniden boyutlandırabilirsiniz.

Bir .svg dosyasını yeniden boyutlandırmak kadar kolay değil, ancak zaten büyük, yüksek çözünürlüklü bir görüntünüz varsa, bir .png dosyasını .svg'ye dönüştürmeye çalışmaktan kesinlikle daha kolay ve hızlı.


2

Bunu yapmak için yazılım yazmak istediğinizi varsayıyorum. Saf bir şekilde yapmak için sadece çizgiler bulabilir ve vektörleri ayarlayabilirsiniz. Bunu akıllıca yapmak için, şekillere çizim (şekil uydurma) takmaya çalışırsınız. Ayrıca, bit eşlemli bölgeleri (utançlarla modelleme yapamayacağınız veya doku uygulayamadığınız bölgeler) tespit etmeye çalışmalısınız. Bu rotaya gitmeyi tavsiye etmem, çünkü biraz zaman alacak ve biraz grafik ve bilgisayar görme bilgisi gerektirecektir. Ancak, çıktı orijinal çıktınızdan çok daha iyi ve ölçeklendirilir.



0

Bu araç şu anda çok iyi çalışıyor.

http://www.mobilefish.com/services/image2svg/image2svg.php


17
Bu, görüntüyü gerçek vektör grafiklerine değil,
svg'ye

Bu, diğer çevrimiçi dönüştürücülerin düzgün bir şekilde dönüştürülemediği renkli png'lerden birini dönüştürdü. Tarayıcıda açabildiğimden beri çalıştığını düşündüm, ancak başka bir araçta açmayı denediğimde bir hata var. Belki yukarıda belirtilen yorum yüzünden.
vida

-1

Bazı Linux sistemindeyseniz, imagemagick mükemmeldir. yani

convert somefile.png somefile.svg

Bu, farklı formatlardaki yığınlarla çalışır.

Videolar ve ses kullanımı (ffmpeg) gibi diğer medya için açıkça svg png belirttiğiniz biliyorum; Hala medyayla ilgili.

ffmpeg -i somefile.mp3 somefile.ogg

Sadece bir sürü dosya üzerinden gitmek istiyorsanız için bir ipucu; basit kabuk hileleri kullanarak bir döngü ..

for f in *.jpg; do convert $f ${f%jpg}png; done

Bu jpg'yi kaldırır ve istediğinizi dönüştürmenizi söyleyen png ekler.


2
Imagemagick sadece 'Linux' üzerinde değil diğer platformlarda da çalışır.
Lunatik

25
Bu teknik olarak çalışır, ancak oluşturulan svg dosyası gerçekten vektör grafikleri değildir - sadece "olduğu gibi" orijinal bitmap içerir. Böylece, büyüttüğünüzde, bir raster görüntüsünün kalitesizliğini hala elde edersiniz.
Erel Segal-Halevi

7
@archeyDevil no, bu SVG'ye "dönüştürülmüyor", bitmap'i boş bir SVG'nin içine "gömüyor". Kimseye faydası yok.
Adam

4
@archeyDevil Soru başlığı "SVG'ye dönüştür". Cevabınız dönüşmüyor. Gömüyor. PNG bir bitmap biçimidir, SVG bir vektör biçimidir. Büyük fark. Gömme işe yaramaz ve SO sorusuna layık değildir IMHO
Adam

3
Dönüştürmediğinin farkındayım. Ancak yaptım; bunu bir vektör denemesine ihtiyaç duymayanlar için, ancak sadece dosya türleri arasında hızlı ve kirli bir değişikliğe ihtiyaç duyanlar için gönderin.
DarkFox
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.