Test SVG export of Tutorial 1 Slide 10

[Joseph Boyle <planetwork@josephboyle.net>]

Scalable Vector Graphics code can be included in XML (directly in the spec text file, or possibly included from another file) and will display as graphics in newer browsers.

As usual with GUI drawing tools the SVG output can be bulky and not very human-readable because it’s not using round numbers and is using arbitrary generated IDs.

If modified to use round numbers and reimported, probably LibreOffice will respect this.

JPG output from LibreOfficeDraw:

SVG file exported from LibreOffice Draw:

SVG text from file:

	<?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 version="1.2" width="215.9mm" height="279.4mm" viewBox="0 0 21590 27940" preserveAspectRatio="xMidYMid" fill-rule="evenodd" clip-path="url(#presentation_clip_path)" stroke-width="28.222" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg" xmlns:ooo="http://xml.openoffice.org/svg/export" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve">
	<defs class="ClipPathGroup">
	<clipPath id="presentation_clip_path" clipPathUnits="userSpaceOnUse">
	<rect x="0" y="0" width="21590" height="27940"/>
	</clipPath>
	</defs>
	<defs class="TextShapeIndex">
	<g ooo:slide="id1" ooo:id-list="id3 id4 id5 id6 id7 id8 id9 id10 id11 id12 id13 id14 id15 id16 id17 id18 id19 id20 id21 id22 id23 id24 id25 id26 id27 id28 id29"/>
	</defs>
	<defs class="EmbeddedBulletChars">
	<g id="bullet-char-template(57356)" transform="scale(0.00048828125,-0.00048828125)">
	<path d="M 580,1141 L 1163,571 580,0 -4,571 580,1141 Z"/>
	</g>
	<g id="bullet-char-template(57354)" transform="scale(0.00048828125,-0.00048828125)">
	<path d="M 8,1128 L 1137,1128 1137,0 8,0 8,1128 Z"/>
	</g>
	<g id="bullet-char-template(10146)" transform="scale(0.00048828125,-0.00048828125)">
	<path d="M 174,0 L 602,739 174,1481 1456,739 174,0 Z M 1358,739 L 309,1346 659,739 1358,739 Z"/>
	</g>
	<g id="bullet-char-template(10132)" transform="scale(0.00048828125,-0.00048828125)">
	<path d="M 2015,739 L 1276,0 717,0 1260,543 174,543 174,936 1260,936 717,1481 1274,1481 2015,739 Z"/>
	</g>
	<g id="bullet-char-template(10007)" transform="scale(0.00048828125,-0.00048828125)">
	<path d="M 0,-2 C -7,14 -16,27 -25,37 L 356,567 C 262,823 215,952 215,954 215,979 228,992 255,992 264,992 276,990 289,987 310,991 331,999 354,1012 L 381,999 492,748 772,1049 836,1024 860,1049 C 881,1039 901,1025 922,1006 886,937 835,863 770,784 769,783 710,716 594,584 L 774,223 C 774,196 753,168 711,139 L 727,119 C 717,90 699,76 672,76 641,76 570,178 457,381 L 164,-76 C 142,-110 111,-127 72,-127 30,-127 9,-110 8,-76 1,-67 -2,-52 -2,-32 -2,-23 -1,-13 0,-2 Z"/>
	</g>
	<g id="bullet-char-template(10004)" transform="scale(0.00048828125,-0.00048828125)">
	<path d="M 285,-33 C 182,-33 111,30 74,156 52,228 41,333 41,471 41,549 55,616 82,672 116,743 169,778 240,778 293,778 328,747 346,684 L 369,508 C 377,444 397,411 428,410 L 1163,1116 C 1174,1127 1196,1133 1229,1133 1271,1133 1292,1118 1292,1087 L 1292,965 C 1292,929 1282,901 1262,881 L 442,47 C 390,-6 338,-33 285,-33 Z"/>
	</g>
	<g id="bullet-char-template(9679)" transform="scale(0.00048828125,-0.00048828125)">
	<path d="M 813,0 C 632,0 489,54 383,161 276,268 223,411 223,592 223,773 276,916 383,1023 489,1130 632,1184 813,1184 992,1184 1136,1130 1245,1023 1353,916 1407,772 1407,592 1407,412 1353,268 1245,161 1136,54 992,0 813,0 Z"/>
	</g>
	<g id="bullet-char-template(8226)" transform="scale(0.00048828125,-0.00048828125)">
	<path d="M 346,457 C 273,457 209,483 155,535 101,586 74,649 74,723 74,796 101,859 155,911 209,963 273,989 346,989 419,989 480,963 531,910 582,859 608,796 608,723 608,648 583,586 532,535 482,483 420,457 346,457 Z"/>
	</g>
	<g id="bullet-char-template(8211)" transform="scale(0.00048828125,-0.00048828125)">
	<path d="M -4,459 L 1135,459 1135,606 -4,606 -4,459 Z"/>
	</g>
	</defs>
	<defs class="TextEmbeddedBitmaps"/>
	<g>
	<g id="id2" class="Master_Slide">
	<g id="bg-id2" class="Background"/>
	<g id="bo-id2" class="BackgroundObjects"/>
	</g>
	</g>
	<g class="SlideGroup">
	<g>
	<g id="id1" class="Slide" clip-path="url(#presentation_clip_path)">
	<g class="Page">
	<g class="com.sun.star.drawing.CustomShape">
	<g id="id3">
	<path fill="rgb(255,255,255)" stroke="none" d="M 1674,1018 C 2034,1018 2309,1293 2309,1653 2309,2013 2034,2288 1674,2288 1314,2288 1039,2013 1039,1653 1039,1293 1314,1018 1674,1018 Z M 1039,1018 L 1039,1018 Z M 2310,2289 L 2310,2289 Z"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 1674,1018 C 2034,1018 2309,1293 2309,1653 2309,2013 2034,2288 1674,2288 1314,2288 1039,2013 1039,1653 1039,1293 1314,1018 1674,1018 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.CustomShape">
	<g id="id4">
	<path fill="rgb(0,0,0)" stroke="none" d="M 5306,5920 C 5666,5920 5941,6195 5941,6555 5941,6915 5666,7190 5306,7190 4946,7190 4671,6915 4671,6555 4671,6195 4946,5920 5306,5920 Z M 4671,5920 L 4671,5920 Z M 5942,7191 L 5942,7191 Z"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,5920 C 5666,5920 5941,6195 5941,6555 5941,6915 5666,7190 5306,7190 4946,7190 4671,6915 4671,6555 4671,6195 4946,5920 5306,5920 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.ConnectorShape">
	<g id="id5">
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 1674,2288 C 1674,5133 2423,6149 3922,6478"/>
	<path fill="rgb(0,0,0)" stroke="none" d="M 4671,6555 L 3913,6208 3857,6732 4671,6555 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id6">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="2508" y="4216"><tspan fill="rgb(128,128,128)" stroke="none">=alice</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id7">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="6959" y="6883"><tspan fill="rgb(0,0,0)" stroke="none">=alice</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.CustomShape">
	<g id="id8">
	<path fill="rgb(0,0,0)" stroke="none" d="M 5306,20681 C 5666,20681 5941,20956 5941,21316 5941,21676 5666,21951 5306,21951 4946,21951 4671,21676 4671,21316 4671,20956 4946,20681 5306,20681 Z M 4671,20681 L 4671,20681 Z M 5942,21952 L 5942,21952 Z"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,20681 C 5666,20681 5941,20956 5941,21316 5941,21676 5666,21951 5306,21951 4946,21951 4671,21676 4671,21316 4671,20956 4946,20681 5306,20681 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.CustomShape">
	<g id="id9">
	<path fill="rgb(0,0,0)" stroke="none" d="M 5306,25888 C 5666,25888 5941,26163 5941,26523 5941,26883 5666,27158 5306,27158 4946,27158 4671,26883 4671,26523 4671,26163 4946,25888 5306,25888 Z M 4671,25888 L 4671,25888 Z M 5942,27159 L 5942,27159 Z"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,25888 C 5666,25888 5941,26163 5941,26523 5941,26883 5666,27158 5306,27158 4946,27158 4671,26883 4671,26523 4671,26163 4946,25888 5306,25888 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id10">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="6959" y="21545"><tspan fill="rgb(0,0,0)" stroke="none">=bob</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id11">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="6959" y="26752"><tspan fill="rgb(0,0,0)" stroke="none">@acme</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.ConnectorShape">
	<g id="id12">
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 1674,2288 C 1674,14974 2452,19734 4007,21052"/>
	<path fill="rgb(0,0,0)" stroke="none" d="M 4671,21316 L 4041,20770 3840,21257 4671,21316 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.ConnectorShape">
	<g id="id13">
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 1674,2288 C 1674,18445 2460,24599 4033,26215"/>
	<path fill="rgb(0,0,0)" stroke="none" d="M 4671,26523 L 4082,25933 3846,26404 4671,26523 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id14">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="3225" y="18524"><tspan fill="rgb(128,128,128)" stroke="none">=bob</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id15">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="3552" y="23976"><tspan fill="rgb(128,128,128)" stroke="none">@acme</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.ConnectorShape">
	<g id="id16">
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,7190 C 5306,9719 6178,10665 7921,10930"/>
	<path fill="rgb(0,0,0)" stroke="none" d="M 8672,10983 L 7903,10661 7864,11187 8672,10983 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id17">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="6375" y="8915"><tspan fill="rgb(128,128,128)" stroke="none">&lt;+email&gt;</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id18">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="10972" y="11229"><tspan fill="rgb(0,0,0)" stroke="none">=alice&lt;+email&gt;</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.ConnectorShape">
	<g id="id19">
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 9307,11618 C 9307,14277 9905,15149 11102,15505"/>
	<path fill="rgb(0,0,0)" stroke="none" d="M 11847,15606 L 11102,15233 11027,15755 11847,15606 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id20">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="10324" y="13317"><tspan fill="rgb(128,128,128)" stroke="none">&amp;</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.CustomShape">
	<g id="id21">
	<path fill="rgb(255,255,255)" stroke="none" d="M 16227,20862 L 15655,20862 15655,19719 16798,19719 16798,20862 16227,20862 Z"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 16227,20862 L 15655,20862 15655,19719 16798,19719 16798,20862 16227,20862 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.ConnectorShape">
	<g id="id22">
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 12482,16241 C 12482,16295 12482,16348 12483,16401"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 12498,16858 C 12500,16906 12503,16954 12506,17002"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 12551,17466 C 12557,17515 12564,17563 12571,17611"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 12656,18064 C 12668,18113 12680,18160 12692,18206"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 12836,18642 C 12855,18690 12874,18736 12895,18781"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 13117,19179 C 13146,19221 13177,19263 13208,19303"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 13522,19631 C 13561,19663 13601,19695 13642,19725"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 14034,19958 C 14079,19979 14124,19999 14171,20018"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 14604,20160 C 14652,20173 14702,20185 14752,20196"/>
	<path fill="rgb(0,0,0)" stroke="none" d="M 15656,20291 L 14892,19957 14845,20482 15656,20291 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id23">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="14134" y="15857"><tspan fill="rgb(0,0,0)" stroke="none">=alice&lt;+email&gt;&amp;</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id24">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="13725" y="18317"><tspan fill="rgb(128,128,128)" stroke="none">&amp;</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.ConnectorShape">
	<g id="id25">
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,7190 L 5306,7489"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,7789 L 5306,8088"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,8388 L 5306,8687"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,8987 L 5306,9286"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,9586 L 5306,9885"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,10184 L 5306,10484"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,10783 L 5306,11083"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,11382 L 5306,11682"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,11981 L 5306,12280"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,12580 L 5306,12879"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,13179 L 5306,13478"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,13778 L 5306,14077"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,14377 L 5306,14676"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,14975 L 5306,15275"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,15574 L 5306,15874"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,16173 L 5306,16473"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,16772 L 5306,17072"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,17371 L 5306,17670"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,17970 L 5306,18269"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,18569 L 5306,18868"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,19168 L 5306,19467"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 5306,19766 L 5306,19926"/>
	<path fill="rgb(0,0,0)" stroke="none" d="M 5306,20681 L 5570,19891 5043,19891 5306,20681 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id26">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="6254" y="15338"><tspan fill="rgb(0,0,0)" stroke="none">+friend</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.TextShape">
	<g id="id27">
	<text class="TextShape"><tspan class="TextParagraph" font-family="Droid Sans Mono, monospace" font-size="635px" font-weight="400"><tspan class="TextPosition" x="13240" y="22235"><tspan fill="rgb(0,0,0)" stroke="none">“</tspan><tspan fill="rgb(0,0,0)" stroke="none">alice@email.com”</tspan></tspan></tspan></text>
	</g>
	</g>
	<g class="com.sun.star.drawing.CustomShape">
	<g id="id28">
	<path fill="rgb(0,0,0)" stroke="none" d="M 9307,10348 L 9943,10983 9307,11619 8672,10983 9307,10348 9307,10348 Z M 8672,10348 L 8672,10348 Z M 9943,11619 L 9943,11619 Z"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 9307,10348 L 9943,10983 9307,11619 8672,10983 9307,10348 9307,10348 Z"/>
	</g>
	</g>
	<g class="com.sun.star.drawing.CustomShape">
	<g id="id29">
	<path fill="rgb(255,255,255)" stroke="none" d="M 12482,14971 L 13118,15606 12482,16242 11847,15606 12482,14971 12482,14971 Z M 11847,14971 L 11847,14971 Z M 13118,16242 L 13118,16242 Z"/>
	<path fill="none" stroke="rgb(0,0,0)" stroke-width="152" d="M 12482,14971 L 13118,15606 12482,16242 11847,15606 12482,14971 12482,14971 Z"/>
	</g>
	</g>
	</g>
	</g>
	</g>
	</g>
	</svg>