Probleme beim Erstellen von einer SVG-Grafik

[rony12]

ich spiele gerade ein bissel mit dem Erstellen von SVG rum.

dabei habe ich erst etwas mit der Testversion von Photoshop erstellt (siehe die angehängte Grafik).

Ich habe danach nochmal alles mit der Testversion von Illustrator erstellt und als SVG gespeichert.
Nun soll alles, was in der Grafik weiß ist, transparent sein. Und die Schrift sollte unabhängig davon ob sie installiert ist oder nicht, angezeigt werden.

ich stell hier auch den Code von der SVG rein, welchen ich schon erstellt habe

meine eig. Probleme sind also, das Bild ist jetzt immer größer als der Inhalt, das weiße soll transparent sein und die Schrift sollte als "Grafik" gespeichert werden und nicht als Font, bzw. unabhängig davon ob sie auf dem System vorhanden sind, angezeigt werden.


Hat jemand Erfahrungen mit dem erstellen von SVG-Grafiken


Code:


----------

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!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="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
    width="640px" height="480px" viewBox="0 0 640 480" enable-background="new 0 0 640 480" xml:space="preserve">
<font horiz-adv-x="2048">
<!-- Nunito is a trademark of vernon adams. -->
<!-- Copyright: Copyright 2011 Adobe System Incorporated. All rights reserved. -->
<font-face font-family="Nunito" units-per-em="2048" underline-position="-154" underline-thickness="102"/>
<missing-glyph horiz-adv-x="933"/>
<glyph unicode="9" horiz-adv-x="1230" d="M213,36C196,43 183,54 176,69C168,83 164,98 164,114C164,127 166,139 171,152C175,165 181,176 189,186C197,196 206,204 217,211C228,217 240,220 253,220C257,220 261,220 265,219C269,218 273,217 277,216C323,199 368,187 411,178C454,169 493,164 530,164C579,164 622,171 659,186C696,200 727,220 754,245C781,270 803,300 821,335C838,370 852,408 863,449C873,490 880,533 884,579C888,625 890,672 890,719C890,720 890,720 889,720C888,720 887,720 887,721C870,688 849,660 824,636C799,612 771,592 741,577C710,562 677,550 642,543C607,535 570,531 533,531C465,531 403,542 348,563C292,584 244,615 205,654C166,693 135,741 114,797C93,852 82,915 82,984C82,1055 94,1120 117,1179C140,1238 174,1290 218,1333C262,1376 315,1409 378,1433C441,1457 511,1469 590,1469C693,1469 780,1451 851,1416C922,1381 979,1333 1023,1272C1067,1211 1099,1139 1119,1058C1138,977 1148,890 1148,799C1148,728 1144,659 1137,590C1129,521 1116,456 1098,395C1080,333 1056,276 1025,224C994,171 956,126 911,88C865,50 811,20 748,-1C685,-23 612,-34 529,-34C476,-34 422,-28 367,-16C312,-5 260,13 213,36M599,1286C556,1286 518,1279 485,1266C452,1252 424,1232 401,1207C378,1181 360,1150 349,1114C337,1078 331,1038 331,994C331,952 336,913 346,877C355,840 370,808 391,781C411,754 437,732 468,717C499,701 537,693 580,693C626,693 667,701 702,716C737,731 767,752 792,779C816,806 834,838 847,876C859,913 865,955 865,1000C865,1041 859,1078 846,1113C833,1148 814,1178 791,1204C767,1229 739,1249 706,1264C673,1279 638,1286 599,1286z"/>
<glyph unicode="d" horiz-adv-x="1207" d="M1083,112C1083,93 1080,77 1073,63C1066,49 1058,37 1047,28C1036,19 1024,12 1011,7C997,2 983,0 968,0C954,0 940,2 926,7C912,11 900,18 889,27C878,36 868,47 861,60C854,73 849,89 848,106l0,10C848,123 848,132 848,141C847,150 847,157 846,164l0,11C802,113 751,66 692,34C633,2 568,-14 497,-14C428,-14 368,1 317,30C266,59 223,99 189,148C154,197 128,253 111,317C94,380 85,443 85,506C85,571 94,636 112,699C130,762 157,817 192,864C227,910 270,946 322,973C374,1000 434,1013 502,1013C536,1013 570,1009 604,1001C638,992 670,980 701,964C731,947 759,927 784,903C809,878 831,854 848,830l0,497C848,1346 851,1362 858,1376C865,1389 874,1401 885,1410C896,1419 908,1425 922,1430C936,1435 950,1437 965,1437C980,1437 994,1435 1009,1430C1023,1425 1036,1419 1047,1410C1058,1401 1066,1389 1073,1375C1080,1361 1083,1345 1083,1327M581,857C532,857 492,847 460,827C427,807 401,780 382,747C362,714 348,676 340,633C331,590 327,548 327,509C327,471 330,430 337,386C344,341 356,301 374,265C392,228 417,198 448,175C479,152 520,140 569,140C623,140 668,150 703,169C738,188 767,214 788,248C809,281 823,320 832,363C841,406 845,457 845,514C845,565 841,610 832,649C823,687 808,722 787,754C766,786 739,811 706,830C672,848 630,857 581,857z"/>
<glyph unicode="e" horiz-adv-x="1158" d="M1073,533C1073,515 1067,499 1056,486C1044,472 1026,465 1002,465l-681,0C327,368 357,293 411,240C464,187 535,160 623,160C677,160 728,168 776,183C824,198 873,219 923,244C935,250 946,253 957,253C975,253 990,246 1001,233C1012,220 1017,204 1017,187C1017,180 1016,172 1014,164C1011,155 1007,147 1002,140C981,113 955,89 924,70C893,51 859,35 823,23C787,11 750,2 712,-3C673,-9 636,-12 600,-12C527,-12 460,0 397,24C334,48 280,83 234,129C187,174 151,231 125,298C98,365 85,434 85,505C85,566 97,627 122,690C147,753 181,807 224,854C267,901 318,939 379,969C439,998 509,1013 589,1013C671,1013 742,1000 802,974C861,948 911,913 951,870C990,827 1020,775 1041,715C1061,654 1072,594 1073,533M865,585C862,617 855,651 842,687C829,723 812,754 789,780C766,805 738,825 705,838C672,851 634,857 591,857C552,857 517,850 486,836C454,822 427,802 404,775C381,748 362,717 348,682C334,647 326,614 323,585z"/>
<glyph unicode="h" horiz-adv-x="1195" d="M824,633C824,671 819,704 808,732C797,760 783,783 765,802C747,821 726,835 702,844C678,853 653,857 626,857C591,857 558,851 527,840C496,829 470,812 447,789C424,766 405,739 392,708C379,677 372,639 372,592l0,-479C372,94 369,78 362,64C355,50 347,38 336,29C325,19 312,12 298,7C283,2 269,0 254,0C239,0 225,2 211,7C197,12 185,19 174,29C163,38 154,50 147,64C140,78 137,94 137,113l0,1214C137,1345 140,1361 147,1375C154,1389 163,1401 174,1410C185,1419 197,1425 212,1430C226,1435 240,1437 255,1437C270,1437 284,1435 298,1430C312,1425 325,1419 336,1410C347,1401 355,1389 362,1375C369,1361 372,1345 372,1327l0,-512C384,840 402,865 425,892C448,918 474,940 504,958C534,976 566,990 601,999C636,1008 671,1013 707,1013C754,1013 798,1006 841,991C883,976 920,954 953,923C985,892 1011,852 1030,804C1049,755 1058,698 1058,631l0,-518C1058,94 1055,78 1048,64C1041,50 1033,38 1022,29C1011,19 998,12 984,7C969,2 955,0 940,0C925,0 911,2 898,7C884,12 872,19 861,29C850,38 841,50 834,64C827,78 824,94 824,113z"/>
<glyph unicode="n" horiz-adv-x="1195" d="M137,891C137,909 140,925 147,939C154,953 163,965 174,974C185,983 197,989 212,994C226,999 240,1001 255,1001C270,1001 284,999 298,995C311,990 324,984 335,975C346,966 354,955 361,942C368,929 371,913 372,895l0,-78C384,842 402,867 425,893C448,919 474,941 504,959C534,976 566,990 601,999C636,1008 671,1013 707,1013C754,1013 798,1006 841,991C883,976 920,954 953,923C985,892 1011,852 1030,804C1049,755 1058,698 1058,631l0,-518C1058,94 1055,78 1048,64C1041,50 1033,38 1022,29C1011,19 998,12 984,7C969,2 955,0 940,0C925,0 911,2 898,7C884,12 872,19 861,29C850,38 841,50 834,64C827,78 824,94 824,113l0,520C824,671 819,704 808,732C797,760 783,783 765,802C747,821 726,835 702,844C678,853 653,857 626,857C591,857 558,851 527,840C496,829 470,812 447,789C424,766 405,739 392,709C379,679 372,641 372,594l0,-481C372,94 369,78 362,64C355,50 347,38 336,29C325,19 312,12 298,7C283,2 269,0 254,0C239,0 225,2 211,7C197,12 185,19 174,29C163,38 154,50 147,64C140,78 137,94 137,113z"/>
<glyph unicode="r" horiz-adv-x="763" d="M137,891C137,909 141,925 148,939C155,953 164,965 175,974C186,983 198,989 213,994C227,999 241,1001 256,1001C270,1001 284,999 297,995C310,990 322,984 333,976C344,967 353,957 360,944C367,931 370,915 371,898C371,897 371,893 372,885C372,877 372,868 372,858C372,847 372,838 372,830C372,822 372,818 372,817C387,874 417,921 460,958C503,995 561,1013 634,1013C651,1013 666,1010 679,1005C692,999 702,992 711,983C720,974 726,964 731,953C735,942 737,930 737,918C737,906 735,894 731,883C726,872 720,862 711,853C702,844 690,836 677,831C663,825 647,822 629,822C590,822 555,816 524,805C492,794 465,777 443,754C420,731 403,704 391,674C378,644 372,606 372,559l0,-448C372,92 369,76 362,63C355,49 346,37 335,28C324,19 311,12 297,7C282,2 268,0 253,0C238,0 224,2 211,7C197,12 185,19 174,28C163,37 154,48 147,62C140,76 137,92 137,111z"/>
<glyph unicode="t" horiz-adv-x="743" d="M226,1001l19,269C246,1285 251,1298 258,1310C265,1321 273,1331 284,1339C295,1347 306,1353 319,1357C332,1361 344,1363 357,1363C381,1363 402,1356 421,1341C440,1326 449,1303 449,1272l0,-271l153,0C629,1001 650,993 664,976C678,959 685,940 685,920C685,900 678,882 665,865C651,848 630,840 602,840l-153,0l0,-416C449,377 450,337 452,304C453,271 458,245 465,225C472,204 483,190 498,181C513,172 533,167 560,167C567,167 574,167 582,168C590,169 598,170 606,171C614,172 622,172 629,173C636,174 641,174 645,174C670,174 690,166 704,149C718,132 725,114 725,93C725,72 719,54 706,41C693,28 676,17 655,9C634,1 610,-4 584,-7C558,-10 532,-12 505,-12C458,-12 417,-6 381,6C345,18 315,38 290,66C265,93 247,130 234,175C221,220 214,276 214,342l0,498l-97,0C89,840 68,848 55,865C41,882 34,900 34,920C34,940 41,959 55,976C69,993 90,1001 118,1001z"/>
<glyph unicode="u" horiz-adv-x="1195" d="M1058,112C1058,93 1055,77 1048,63C1041,49 1033,37 1022,28C1011,19 998,12 984,7C969,2 955,0 940,0C926,0 912,2 899,7C885,11 873,18 862,27C851,36 842,47 835,60C828,73 825,88 824,106l0,75C811,156 792,131 769,106C746,81 719,59 689,42C659,24 627,11 593,2C558,-7 524,-12 489,-12C442,-12 398,-4 355,11C312,26 275,49 243,80C210,111 185,151 166,199C147,247 137,303 137,366l0,522C137,907 140,923 147,937C154,951 163,963 174,973C185,982 197,989 211,994C225,999 239,1001 254,1001C269,1001 283,999 298,994C312,989 325,982 336,973C347,963 355,951 362,937C369,923 372,907 372,888l0,-526C372,327 377,295 388,267C399,239 413,216 431,197C449,178 470,165 494,156C518,147 543,142 569,142C602,142 634,147 664,158C694,168 720,184 743,205C766,226 784,250 799,278C813,305 821,340 824,383l0,506C824,908 827,924 834,938C841,952 850,964 861,973C872,982 884,989 898,994C912,999 926,1001 941,1001C956,1001 970,999 984,994C998,989 1011,982 1022,973C1033,964 1041,952 1048,938C1055,924 1058,908 1058,889z"/>
</font>

    <text transform="matrix(1 0 0 1 71.1836 207.0679)" font-family="'Nunito'" font-size="72">hundert</text>
<path d="M415,157c0-6.627-5.373-12-12-12h-50c-6.627,0-12,5.373-12,12v50c0,6.627,5.373,12,12,12h50c6.627,0,12-5.373,12-12V157z"/>
<text transform="matrix(1 0 0 1 381 207.0679)" fill="#FFFFFF" font-family="'Nunito'" font-size="72">9</text>
</svg>

 

[geodreieck24]

Du musst den Text als Pfad speichern, allerdings weiß ich nicht, wie das in Photoshop funktioniert. In Inkscape muss man dazu den Text markieren und auf Pfad - Objekt in Pfad umwandeln klicken.
Und zum transparenten Hintergrund: Hab die svg in Inkscape geöffnet und da hatte sie bereits einen transparenten Hintergrund. Evt. ist nur beim Bitmap-Export etwas schief gelaufen.

 

[rony12]

ok, ich habe jetzt den halben tag damit rumgebastelt^^... und nun hab ich mein gewünschtes ergebnis - deine paar tipps haben mich auch weitergebracht - danke