SVG export test
Сравниваем качество экспорта в SVG из различных популярных программ.
SVG test
Задача - создать простой SVG рисунок, но так чтобы его можно было открыть не только Adobe SVG viewroм, но и структура полученного XML файла нашего рисунка была максимально простой - без лишних тегов, без лишней информации.
Попробуем воспользоваться экспортом из распростараненных графических пакетов - Adobe Illustrator, Corel Draw, Microsoft Visio, OpenOffice Draw. Тестовый рисунок - простой прямоугольник с текстом внутри (см. рисунок) и посмотрим что из этого получилось.
Test #1. Microsoft Visio 2003
Save as SVG in Visio
Рисуем в Microsoft Visio 2003 прямоугольник с текстом и сохраняем Save as... как SVG, в результате получаем следующую XMLку:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<!-- Generated by Microsoft Visio 11.0, SVG Export, v1.0 visio.svg Page-1 -->
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:v="http://schemas.microsoft.com/visio/2003/SVGExtensions/"
width="8.26772in" height="11.6929in" viewBox="0 0 595.276 841.89"
xml:space="preserve" color-interpolation-filters="sRGB" class="st3">
<v:documentProperties v:langID="1033" v:viewMarkup="false"/>
<style type="text/css"><![CDATA[
.st1 {fill:#e8eef7;stroke:#000000;stroke-linecap:round;
stroke-linejoin:round;stroke-width:0.24}
.st2 {fill:#000000;font-family:Arial;font-size:1.00001em}
.st3 {fill:none;fill-rule:evenodd;font-size:12;overflow:visible;
stroke-linecap:square;stroke-miterlimit:3}
]]></style>
<g v:mID="0" v:index="1" v:groupContext="foregroundPage">
<v:userDefs>
<v:ud v:nameU="SchemeName" v:val="VT4(Default)"/>
</v:userDefs>
<title>Page-1</title>
<v:pageProperties
v:drawingScale="0.0393701"
v:pageScale="0.0393701"
v:drawingUnits="24"
v:shadowOffsetX="8.50394"
v:shadowOffsetY="-8.50394"/>
<v:layer v:name="Connector" v:index="0"/>
<g id="shape1-1"
v:mID="1" v:groupContext="shape"
transform="translate(28.3465,-723.543)">
<title>Rectangle</title>
<desc>Template</desc>
<v:userDefs>
<v:ud v:nameU="visVersion" v:val="VT0(11):26"/>
</v:userDefs>
<v:textBlock v:margins="rect(4,4,4,4)" v:tabSpace="42.5197"/>
<v:textRect cx="120.472" cy="799.724"
width="240.95" height="84.3307"/>
<rect x="0" y="757.559"
width="240.945" height="84.3307" class="st1"/>
<text x="95.46" y="803.32" class="st2"
v:langID="1033">
<v:paragraph v:horizAlign="1"/>
<v:tabList/>Template
</text>
</g>
</g>
</svg>
Вобщем-то неплохо, попробуем достать отсюда чистый svg (в соответствии со спецификацией 1,0) без дополнительных неймспейсов от Visio. Для этого преобразуем SVG следующими XSLT, которые удалят из нашего SVG все элементы и аттрибуты с namespasom Visio:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet
version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:v="http://schemas.microsoft.com/visio/2003/SVGExtensions/">
<xsl:import xhref="copy.xslt" mce_href="copy.xslt"/>
<xsl:output method="xml" version="1.0" encoding="UTF-8" indent="yes"/>
<xsl:strip-space elements="*"/>
<xsl:template match="@*">
<xsl:attribute name="{name()}" namespace="{namespace-uri( )}">
<xsl:value-of select="."/>
</xsl:attribute>
</xsl:template>
<xsl:template match="v:*" />
<xsl:template match="@v:*" />
</xsl:stylesheet>
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/ | node( ) | @*">
<xsl:copy>
<xsl:apply-templates select="@*"/>
<xsl:apply-templates/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
Вот результат:
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated by Microsoft Visio 11.0, SVG Export, v1.0 visio.svg Page-1 -->
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:v="http://schemas.microsoft.com/visio/2003/SVGExtensions/"
width="8.26772in" height="11.6929in"
viewBox="0 0 595.276 841.89" xml:space="preserve"
color-interpolation-filters="sRGB" class="st3">
<style type="text/css">
.st1 {fill:#e8eef7;stroke:#000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:0.24}
.st2 {fill:#000000;font-family:Arial;font-size:1.00001em}
.st3 {fill:none;fill-rule:evenodd;font-size:12;overflow:visible;stroke-linecap:square;stroke-miterlimit:3}
</style>
<g>
<title>Page-1</title>
<g id="shape1-1" transform="translate(28.3465,-723.543)">
<title>Rectangle</title>
<desc>Template</desc>
<rect x="0" y="757.559"
width="240.945" height="84.3307" class="st1"/>
<text x="95.46" y="803.32"
class="st2">Template</text>
</g>
</g>
</svg>
Результат при просмотре в IE ничем не отичается от SVG без преобразования.
Test #2. OpenOffice 2.0 beta
OpenOffice Draw
OpenOffice Draw это бесплатный аналог Microsoft Visio, занимает меньше места на диске и быстрее, чем Visio. OpenOffice Draw экспортирует в SVG формат при этом не предлагая никаких настроек для экпорта пользователю.
Вот что у него получиться с аналогичным прямоугольником с текстом:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg viewBox="0 0 21000 29700"
preserveAspectRatio="xMidYMid"
fill-rule="evenodd">
<defs>
<font id="EmbeddedFont_1" horiz-adv-x="2048">
<font-face font-family="Arial embedded"
units-per-em="2048"
ascent="1852" descent="450"/>
<missing-glyph horiz-adv-x="2048">
<path style="fill:none;stroke:black;stroke-width:33"
d="M 0,2048 L 2047,2048 2047,1 0,1 0,2048 Z"/>
</missing-glyph>
<glyph unicode="T" horiz-adv-x="1112">
<path
d="M 531,0 L 531,1293 48,1293 48,1466 1210,1466 1210,1293 725,1293 725,0 531,0 Z"/>
</glyph>
<glyph unicode="a" horiz-adv-x="954">
<path d="M 828,131 C 761,74 697,34 636,11 574,-11 508,
-23 437,-24 320,-23 231,5 168,62 105,119 74,
191 74,280 74,332 86,380 110,423 133,466 164,500 203,526 241,
552 284,572 332,585 367,594 421,603 492,
612 637,629 744,650 813,674 814,699 814,714 814,721 814,794 797,
846 763,876 717,917 649,937 558,937 473,
937 411,922 371,893 330,863 300,810 281,735 L 105,759 C 121,
834 147,895 184,942 221,988 274,1024 343,
1049 412,1074 493,1086 584,1086 675,1086 748,1075 805,1054 862,
1033 903,1006 930,974 957,941 975,
900 986,851 992,820 995,765 995,685 L 995,445 C 995,278 999,
172 1007,128 1014,83 1029,41 1052,0 L 864,
0 C 845,37 833,81 828,131 Z M 813,533 C 748,506 650,484 519,
465 445,454 393,442 362,429 331,416 308,
396 291,371 274,345 266,316 266,285 266,237 284,197 321,165 357,
133 410,117 480,117 549,117 611,
132 665,163 719,193 759,234 784,287 803,328 813,388 813, 467 L 813,533 Z"/>
</glyph>
<glyph unicode="e" horiz-adv-x="954">
<path d="M 862,342 L 1048,319 C 1019,
210 964,126 885,66 806,6 704,-23 581,-24 426,-23 303,24 212,
120 121,215 75,349 75,522 75,701 121,
839 213,938 305,1037 424,1086 571,1086 713,1086 829,1038 919,
941 1009,844 1054,708 1054,533 1054,
522 1054,506 1053,485 L 261,485 C 268,368 301,279 360,217 419,
155 493,124 582,124 648,124 704,
141 751,176 798,211 835,266 862,342 Z M 271,633 L 864,633 C 856,
722 833,789 796,834 739,903 664, 938 573,938 490,938 421,910 365,855 308,800 277,726 271,633 Z"/>
</glyph>
<glyph unicode="l" horiz-adv-x="160">
<path d="M 131,0 L 131,1466 311,1466 311,0 131,0 Z"/>
</glyph>
<glyph unicode="m" horiz-adv-x="1430">
<path d="M 135,0 L 135,1062 296,1062 296,913 C 329,
965 374,1007 429,1039 484,1070 547,1086 618,1086 697,1086 761,
1070 812,1037 862,1004 897,959 918,900 1002,
1024 1111,1086 1246,1086 1351,1086 1432,1057 1489,999 1546,
940 1574,850 1574,729 L 1574,0 1395,0 1395,
669 C 1395,741 1389,793 1378,825 1366,856 1345,882 1314,901 1283,
920 1247,930 1206,930 1131,930 1069,
905 1020,856 971,806 946,726 946,617 L 946,0 766,0 766,690 C 766,
770 751,830 722,870 693,910 645,930 578,
930 527,930 481,917 438,890 395,863 363,824 344,773 325,722 315, 648 315,551 L 315,0 135,0 Z"/>
</glyph>
<glyph unicode="p" horiz-adv-x="901">
<path d="M 135,-407 L 135,1062 299,1062 299,
924 C 338,978 381,1019 430,1046 479,1073 538,1086 607,1086 698,
1086 778,1063 847,1016 916,969 969,
904 1004,819 1039,734 1057,640 1057,539 1057,430 1038,333 999,
246 960,159 903,92 829,46 754,0 676,
-23 594,-24 534,-23 480,-10 433,14 385,39 346,71 315,110 L 315,
-407 135,-407 Z M 298,525 C 298,388 326,
287 381,222 436,157 503,124 582,124 662,124 731,158 788,226 845,
293 873,398 873,540 873,675 845,777 790,
844 734,911 667,945 590,945 513,945 446,909 387,838 328, 766 298,662 298,525 Z"/>
</glyph>
<glyph unicode="t" horiz-adv-x="504">
<path d="M 528,161 L 554,2 C 503,-8 458,-13 418,
-14 353,-13 302,-3 266,17 230,38 205,65 190,99 175,132 168,203 168,
311 L 168,922 36,922 36,1062 168,1062 168,
1325 347,1433 347,1062 528,1062 528,922 347,922 347,301 C 347,
250 350,217 357,202 363,187 373,176 388,167 402, 158 422,154 449,154 469,154 495,156 528,161 Z"/>
</glyph>
</font>
</defs>
<g visibility="visible" id="Default">
<desc>Master slide</desc>
</g>
<g visibility="visible" id="page1">
<desc>Slide</desc>
<g>
<desc>Drawing</desc>
<g>
<g style="stroke:none;fill:rgb(153,204,255)">
<path d="M 1550,1635 L 11550,1635 11550,5135 1550, 5135 1550,1635 Z"/>
</g>
<g style="stroke:rgb(0,0,0);fill:none">
<path style="fill:none"
d="M 6550,5135 L 1550,5135 1550,1635 11550, 1635 11550,5135 6550,5135"/>
</g>
<g>
<g
style="font-family:Arial embedded; font-size:423;font-weight:400">
<g style="stroke:none;fill:rgb(0,0,0)">
<text>
<tspan x="5651 5913 6151 6506 6743 6836 7073 7192 "
y="3524">Template</tspan>
</text>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
Test #3. Adobe Illustrator CS
Adobe Illustrator CS
Adobe Illustrator - очень удобный редактор векторной графики, начиная с 9-й версии умеет делать SVG. В версии CS рисуем прямоугольник с текстом и через меню Save as... сохраняем в SVG формате, что приятно AI предлагает хороший набор настроек сохранения в нашем формате, в том числе выбор из трех кодировок, оптимизация под Adobe Viewer, тип встраивания шрифтов и еще немного других полезных настроек.
А вот соббственно результат сохранения с самыми простыми настройками:
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generator: Adobe Illustrator 11.0, SVG Export Plug-In . SVG Version: 6.0.0 Build 78) -->
<!DOCTYPE svg PUBLIC "//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [
<!ENTITY ns_flows "http://ns.adobe.com/Flows/1.0/">
<!ENTITY ns_svg "http://www.w3.org/2000/svg">
<!ENTITY ns_xlink "http://www.w3.org/1999/xlink">
]>
<svg xmlns="&ns_svg;"
xmlns:xlink="&ns_xlink;"
xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
width="297.591" height="97.591"
viewBox="0 0 297.591 97.591"
style="overflow:visible;enable-background:new 0 0 297.591 97.591"
xml:space="preserve">
<metadata>
<?xpacket begin='?' id='W5M0MpCehiHzreSzNTczkc9d'?>
<x:xmpmeta xmlns:x="adobe:ns:meta/"
x:xmptk="XMP toolkit 3.0-29, framework 1.6">
<rdf:RDF
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:iX="http://ns.adobe.com/iX/1.0/">
<rdf:Description
rdf:about=""
xmlns:pdf="http://ns.adobe.com/pdf/1.3/">
</rdf:Description>
<rdf:Description
rdf:about=""
xmlns:tiff="http://ns.adobe.com/tiff/1.0/">
</rdf:Description>
<rdf:Description
rdf:about=""
xmlns:xap="http://ns.adobe.com/xap/1.0/"
xmlns:xapGImg="http://ns.adobe.com/xap/1.0/g/img/">
<xap:CreateDate>2005-08-19T13:46:57Z</xap:CreateDate>
<xap:ModifyDate>2005-08-19T13:46:57Z</xap:ModifyDate>
<xap:CreatorTool>Illustrator</xap:CreatorTool>
<xap:Thumbnails>
<rdf:Alt>
<rdf:li
rdf:parseType="Resource">
<xapGImg:format>JPEG</xapGImg:format>
<xapGImg:width>256</xapGImg:width>
<xapGImg:height>84</xapGImg:height>
<xapGImg:image>/9j/4AAQSkZJRgABAgEASABIAAD/7QAsUGhvdG9zaG9wIDMuMAA4QklNA+0AAAAA
ABAASAAAAAEA
AQBIAAAAAQAB/+4ADkFkb2JlAGTAAAAAAf/bAIQABgQEBAUEBgUFBgkGBQYJCwgGBggLDAoKCwoK
DBAMDAwMDAwQDA4PEA8ODBMTFBQTExwbGxscHx8fHx8fHx8fHwEHBwcNDA0YEBAYGhURFRofHx8f
Hx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8f/8AAEQgAVAEAAwER
AAIRAQMRAf/EAaIAAAAHAQEBAQEAAAAAAAAAAAQFAwIGAQAHCAkKCwEAAgIDAQEBAQEAAAAAAAAA
AQACAwQFBgcICQoLEAACAQMDAgQCBgcDBAIGAnMBAgMRBAAFIRIxQVEGE2EicYEUMpGhBxWxQiPB
UtHhMxZi8CRygvElQzRTkqKyY3PCNUQnk6OzNhdUZHTD0uIIJoMJChgZhJRFRqS0VtNVKBry4/PE
1OT0ZXWFlaW1xdXl9WZ2hpamtsbW5vY3R1dnd4eXp7fH1+f3OEhYaHiImKi4yNjo+Ck5SVlpeYmZ
qbnJ2en5KjpKWmp6ipqqusra6voRAAICAQIDBQUEBQYECAMDbQEAAhEDBCESMUEFURNhIgZxgZEy
obHwFMHR4SNCFVJicvEzJDRDghaSUyWiY7LCB3PSNeJEgxdUkwgJChgZJjZFGidkdFU38qOzwygp
0+PzhJSktMTU5PRldYWVpbXF1eX1RlZmdoaWprbG1ub2R1dnd4eXp7fH1+f3OEhYaHiImKi4yNjo
+DlJWWl5iZmpucnZ6fkqOkpaanqKmqq6ytrq+v/aAAwDAQACEQMRAD8A6D5N8m+UJvKGhyy6Hp8k
smn2rySPawMzM0CEkkpUknMqMRTSSnH+B/Jf/Vg03/pEg/5ow8IRZd/gfyX/ANWDTf8ApEg/5ox4
Qtl3+B/Jf/Vg03/pEg/5ox4Qtl3+B/Jf/Vg03/pEg/5ox4Qtl3+B/Jf/AFYNN/6RIP8AmjHhC2Xf
4H8l/wDVg03/AKRIP+aMeELZd/gfyX/1YNN/6RIP+aMeELZd/gfyX/1YNN/6RIP+aMeELZd/gfyX
/wBWDTf+kSD/AJox4Qtl3+B/Jf8A1YNN/wCkSD/mjHhC2Xf4H8l/9WDTf+kSD/mjHhC2Xf4H8l/9
WDTf+kSD/mjHhC2Xf4H8l/8AVg03/pEg/wCaMeELZd/gfyX/ANWDTf8ApEg/5ox4Qtl3+B/Jf/Vg
03/pEg/5ox4Qtl3+B/Jf/Vg03/pEg/5ox4Qtl3+B/Jf/AFYNN/6RIP8AmjHhC2Xf4H8l/wDVg03/
AKRIP+aMeELZd/gfyX/1YNN/6RIP+aMeELZd/gfyX/1YNN/6RIP+aMeELZd/gfyX/wBWDTf+kSD/
AJox4Qtl3+B/Jf8A1YNN/wCkSD/mjHhC2Xf4H8l/9WDTf+kSD/mjHhC2Xf4H8l/9WDTf+kSD/mjH
hC2Xf4H8l/8AVg03/pEg/wCaMeELZd/gfyX/ANWDTf8ApEg/5ox4Qtl3+B/Jf/Vg03/pEg/5ox4Q
tl3+B/Jf/Vg03/pEg/5ox4Qtl3+B/Jf/AFYNN/6RIP8AmjHhC2Xf4H8l/wDVg03/AKRIP+aMeELZ
Sfzl5N8oQ+UNcli0PT45Y9PunjkS1gVlZYHIIISoIOCURSQU48j/APKF6B/2zbT/AJMJhjyQead4
VdirsVdirsVdirsVdirsVdirsVdirsVdirsVdirsVdirsVdirsVdirsVdirsVdirsVdirsVdiqSe
eP8AlC9f/wC2bd/8mHwS5KObvI//AChegf8AbNtP+TCYx5Kead4VdirsVdirsVdirsVdirsVdirs
VdirsVdirsVdirsVdirsVdirsVdirsVdirsVdirsVdirsVdiqSeeP+UL1/8A7Zt3/wAmHwS5KObv
I/8Ayhegf9s20/5MJjHkp5p3hV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV
2KuxV2KuxV2KuxV2KuxV2KpJ54/5QvX/APtm3f8AyYfBLko5u8j/APKF6B/2zbT/AJMJjHkp5p3h
V2KuxV2KuxV2KuxV2KuxV2KuxV2KpLb+d/JdzqA0231/TZtRZzEtlHdwNMZFqCgjDluQp0pg4gtJ
1hV2KqUV3ayzTQRTJJNblVuIlYFoy6hlDqDVaqaivbFVyzwvK8KyK0sQUyRggsoavHkOorTbFV+K
uxV2KuxV2KuxV2KuxV2KuxV2KuxV2KpJ54/5QvX/APtm3f8AyYfBLko5u8j/APKF6B/2zbT/AJMJ
jHkp5p3hV2KuxV2KuxV2KuxV2KuxV2KuxV2KsD84aD5vuNR8xXmgEwXF3pOm2tlch1DNJb3t1Lcx
rSSJlYwTAK3JN22YUJESCkFjw8pfmPcaUiSXmqRyQWmsSWsQuzaSJdutr+jopGTUNQaZRIkzK0k7
AV4tRdjGimwparpnm6w1y206Y6zfaZeXbS21ra6q0V1MF02MzATyXETKiXQZuBkUdeIp8JSCrVz5
X/M+KzljMM9zfXv1M3l/a3not60OnJCZG9K606R19cEN+8H83BumNFbCnL5R/MtbVrmGO8j1W8t9
HbWJVvOZmNvbPHeQxql9Z8JPXKNVJY1K1o+9C0VsPTfJtrq9r5ZsbfWJpZ9RjVhNJcKqy0LsUVwk
94CUSi8vWcmlSanJjkxKdYVdirsVdirsVdirsVdirsVdirsVdiqSeeP+UL1//tm3f/Jh8EuSjm7y
P/yhegf9s20/5MJjHkp5p3hV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2K
uxV2KuxV2KuxV2KuxV2KpJ54/wCUL1//ALZt3/yYfBLko5u8j/8AKF6B/wBs20/5MJjHkp5p3hV2
KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KuxV2KpJ54/
5QvX/wDtm3f/ACYfBLko5u8j/wDKF6B/2zbT/kwmMeSnmneFXYq7FXYq7FXYq7FXYq7FXYq7FXYq
7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYqknnj/lC9f8A+2bd/wDJh8EuSjm7yP8A
8oXoH/bNtP8AkwmMeSnmneFXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq7FXYq
7FXYq7FXYq7FXYq7FXYqknnj/lC9f/7Zt3/yYfBLko5sP8pf8rf/AMKaL9U/w/8AVfqNt9X9X676
np+ivDnx+Hlx60yI4qZGk2/5DT/37f8A0/YfUjZ3/Iaf+/b/AOn7H1Ls7/kNP/ft/wDT9j6l2d/y
Gn/v2/8Ap+x9S7O/5DT/AN+3/wBP2PqXZ3/Iaf8Av2/+n7H1Ls7/AJDT/wB+3/0/Y+pdnf8AIaf+
/b/6fsfUuzv+Q0/9+3/0/Y+pdnf8hp/79v8A6fsfUuzv+Q0/9+3/ANP2PqXZ3/Iaf+/b/wCn7H1L
s7/kNP8A37f/AE/Y+pdnf8hp/wC/b/6fsfUuzv8AkNP/AH7f/T9j6l2d/wAhp/79v/p+x9S7O/5D
T/37f/T9j6l2d/yGn/v2/wDp+x9S7O/5DT/37f8A0/Y+pdnf8hp/79v/AKfsfUuzv+Q0/wDft/8A
T9j6l2d/yGn/AL9v/p+x9S7O/wCQ0/8Aft/9P2PqXZ3/ACGn/v2/+n7H1Ls7/kNP/ft/9P2PqXZ3
/Iaf+/b/AOn7H1Ls7/kNP/ft/wDT9j6l2d/yGn/v2/8Ap+x9S7O/5DT/AN+3/wBP2PqXZ3/Iaf8A
v2/+n7H1LslPm3/lb/8AhTWvrf8Ah/6r9RufrHpfXfU9P0W58OXw8uPSuA8VJFP/2Q==</xapGImg:image>
</rdf:li>
</rdf:Alt>
</xap:Thumbnails>
</rdf:Description>
<rdf:Description
rdf:about=""
xmlns:dc="http://purl.org/dc/elements/1.1/">
<dc:format>image/svg+xml</dc:format>
</rdf:Description>
</rdf:RDF>
</x:xmpmeta>
<?xpacket end='w'?>
</metadata>
<g id="Layer_1">
<rect x="0.5" y="0.5"
style="fill:#CED8EA;stroke:#000000;"
width="296.591" height="96.591"/>
<text transform="matrix(1 0 0 1 121.5225 53.3418)">
<tspan x="0" y="0"
style="font-family:'ArialMT'; font-size:12; letter-spacing:-1;">T</tspan>
<tspan x="6" y="0"
style="font-family:'ArialMT'; font-size:12;">emplat</tspan>
<tspan x="42.018" y="0"
style="font-family:'ArialMT'; font-size:12; letter-spacing:1;">e</tspan>
</text>
</g>
</svg>
Test #4. Corel Draw
Corel Draw 11
Corel Draw - отличный графический редактор для верстки многостраничных буклетов, для визиток, для векторной графики вообще. При сохранении в SVG формате Corel Draw также предлагает ряд настроек.
Вот так Corel Draw сохранит простой прямоугольник с текстом:
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<!-- Creator: CorelDRAW -->
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:odm="http://product.corel.com/CGS/11/cddns/"
xml:space="preserve"
width="8.26772in" height="11.6929in"
style="shape-rendering:geometricPrecision;
text-rendering:geometricPrecision;
image-rendering:optimizeQuality; fill-rule:evenodd"
viewBox="0 0 8268 11692">
<defs>
<style type="text/css">
<![CDATA[
.str0 {stroke:#1F1A17;stroke-width:3}
.fil1 {fill:#1F1A17}
.fil0 {fill:#E1EDF9}
.fnt0 {font-weight:normal;font-size:167;font-family:Arial}
]]>
</style>
</defs>
<g id="Layer 1">
<rect class="fil0 str0" x="392" y="568"
width="2439" height="938"/>
<text x="1151" y="1076" class="fil1 fnt0">Template</text>
</g>
</svg>
На мой взгляд это лучший результат из всех приведенных здесь тестов. Результат, с которым можно работать, на его основе легко создавать SVG программно, например, с помощью XSLT трансформации.
Это был пример, созданный с помощью CorelDraw 11 версии. Этот пример в браузерах Mozilla FF 1.5.0.6 и Opera 9.01 работает некорректно: текст в прямоугольнике не показывается. В чем проблема при беглом рассмотрении мне выяснить не удалось.
Однако я проверила экспорт из новой версии CorelDraw X3 (13 версия):
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Creator: CorelDRAW -->
<svg xmlns="http://www.w3.org/2000/svg"
xml:space="preserve" width="210mm" height="297mm"
style="shape-rendering:geometricPrecision;
text-rendering:geometricPrecision; image-rendering:optimizeQuality;
fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 210 297"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<style type="text/css">
<![CDATA[
.str0 {stroke:#1F1A17;stroke-width:0.0762}
.fil1 {fill:#1F1A17}
.fil0 {fill:#00CCFF}
.fnt0 {font-weight:normal;font-size:8.4667;font-family:'Arial'}
]]>
</style>
</defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<rect class="fil0 str0" x="43.5939" y="40.0005"
width="87.2613" height="36.0126"/>
<text x="67.9143" y="61.2387" class="fil1 fnt0">Template</text>
</g>
</svg>
Все работает и в Mozille FF и в Opera, но надо иметь в виду, что текст, не переведенный в кривые, выглядит в браузере (SVG) по-другому, отличаясь довольно существенно от оригинала, который мы наблюдаем в CorelDraw.
А вот настройки, которые предлагает CorelDraw при сохранении в SVG:
Контакт:
ViJu - Виталий и Юлия Сергеевы, разработка WEB-ориентированных приложенийhttp://viju.tvercity.net/contact/
проблемы с Corel Draw
Посмотрел приведенные по тексту примеры в Mozilla FF и Opera.
Пример из MS Visio (после обработки) работает в обоих браузерах одинаково хорошо.
Пример от Corel Draw не работает в обоих браузерах. Вместо текста отображается один символ подчеркивания.
Интересно, в чем может быть проблема?
спасибо за
спасибо за проверку,
дело в том, что статья на самом деле писалась года два назад, когда ни в Mozilla FF, ни в Opera не было SVG, и тестировалось все только в IE с плагином от Adobe
в ближайшее время я исправлю даты и допишу статьи
дописала
дописала статью
Вопрос: Кто
Вопрос: Кто знает как открыть, редактировать или конвертировать SVGB-файл (SVG-Basic)?
Помогите, пожалуйста!!!
Отправить новый комментарий