Комментировать

SVG export test, продолжение

обновление: December 2008

Сравниваем качество экспорта в SVG из Adobe Illustrator CS4 и Inkscape.

Это продолжение, первая часть, где я сравнивала различные варианты экспорта в SVG формат была написана уже давно. С тех пор уже несколько раз обновились основные программы для редактирования векторной графики.

Test #5. Adobe Illustrator CS4

Save as SVG in AI CS4

cs4.svg

Размер SVG: 701 байт


Adobe молодцы - как всегда очень порадовали изменения.
Смотрите сами. Вот как сохраняет AI в SVG все тот же прямоугольник с текстом:

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 14.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 43363)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="120px" height="170px" viewBox="0 0 120 170" enable-background="new 0 0 120 170" xml:space="preserve">
<g>
<rect x="8.435" y="37.12" fill="#FBB03B" stroke="#000000" width="98.913" height="50"/>
<text transform="matrix(1 0 0 1 35.0654 62.1191)" font-family="'MyriadPro-Regular'" font-size="12">Hello</text>
</g>
</svg>

При этом есть из чего выбрать, сохранять можно в следующих форматах:
SVG 1.0
SVG 1.1
SVG Tiny 1.1
SVG Tiny 1.1+
SVG Basic 1.1
SVG Tiny 1.2

В настройках при сохранении в формате SVG есть все необходимое,
больше всего мне понравились две кнопочки:
предпросмотр SVG кода и предпросмотр в браузере.
Т.е. пока вы еще не сохранили можно посмотреть как будет выглядеть результат.

Test #6. Inkscape 0.46, built Apr 1 2008

Теперь посмотрим как сохранит тоже самое Inkscape,
по умолчанию, без всяких настроек:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   version="1.0"
   width="744.09448"
   height="1052.3622"
   id="svg2">
  <defs
     id="defs4" />
  <g
     id="layer1">
    <g
       id="g2676">
      <rect
         width="602.85712"
         height="274.28571"
         x="62.857143"
         y="218.07646"
         id="rect2383"
         style="fill:#ff9955" />
      <text
         x="194.28572"
         y="383.79074"
         id="text2385"
         xml:space="preserve"
         style="font-size:72px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans"><tspan
           x="194.28572"
           y="383.79074"
           id="tspan2387">Hello</tspan></text>
    </g>
  </g>
</svg>

Размер этого файла 972 байта - ink.svg

Можно сказать, что Inkscape специально сделан для редактирования и создания SVG графики - все действительно удобно, просто и понятно.

Чем еще удобен Inkscape - так это наличием XML редактора, т.е. код сразу можно подправить.

XML редактор в Inkscape

Ответ

Содержимое этого поля хранится скрыто и не будет показываться публично.
  • Адреса страниц и электронной почты автоматически преобразовываются в ссылки.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img>
  • Автоматический перевод строки.
  • Вы можете публиковать код, размещая его в <code>...</code> (generic) или в <?php ... ?> (раскрашенный PHP).

Дополнительная информация о настройках форматирования