Skip to content

Instantly share code, notes, and snippets.

@biovisualize

biovisualize/index.html

Forked from ZJONSSON/index.html
Created October 3, 2011 02:31
Show Gist options
  • Save biovisualize/1258314 to your computer and use it in GitHub Desktop.
Save biovisualize/1258314 to your computer and use it in GitHub Desktop.
Download ZIP
Simple transitioning slides with SVG and D3 (from ZJONSSON)
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js"></script>
<script type="text/javascript" src="svg_slides.js"></script>
<script type="text/javascript">
// There are probably better ways of loading the SVG, but this is one example I found
d3.xml("test.svg", "image/svg+xml", function(xml) {
var importedNode = document.importNode(xml.documentElement, true);
d3.select("body").node().appendChild(importedNode);
svg=d3.select("body").select("svg")
.attr("height","100%")
.attr("width","100%");
slides = svg_slides(svg,1500);
// Lets test the slide scales - put a bouncing ball on slide id 3
s = slides[3];
circle = svg.append("svg:circle")
.attr("cx",s.scale_x(500)).attr("cy",s.scale_y(500))
.attr("r",20)
.style("fill","steelblue");
next = 500;
function bounce() {
next = -next;
circle.transition().duration(2500).attr("cx",s.scale_x(500+next))
.each("end",bounce);
}
bounce();
});
</script>
</head>
<body></body>
</html>
Raw
svg_slides.js
/* This is a basic attempt to use d3 to process transitional slides from SVG files (i.e. Inkscape)
The main objective here was to keep everything as simple as possible
To create a slide, simply create a rectangle in inkscape where you set the object ID to "slide_" + a number
This number can be either integer or float, so "slide_1","slide_2" and "slide_3.56" all work.
The script sorts the slide-numbers and transitions between slides based on the final sorted order.
It is easy to add slides into a pre-existing ordering, simply by chosing a floating number in the middle of the two
Example: If we want to add slide between "slide_2" and "slide_3" we simply add a rectancle called "slide_2.5"
Keyboard definitions:
Right arrow: next slide
Left arrow: previous slide
Home: first slide
End: last slide
Please be aware that you need to remove any layer transition is the svg file (or put the layer transition to 0,0)
Each slide has a scale_x and scale_y functions that have pre-set range to the slide boundaries and a default
domain of [0,1000], allowing the user to position objects easily onto each slide.
[email protected]
*/
function svg_slides(svg,delay) {
var slides={},
slide = 0,
delay = delay ? delay : 3500;
svg.attr("preserveAspectRatio","xMidYid meet");
rects = svg.selectAll("rect")[0];
for (i=0;i<rects.length;i++) {
id = rects[i].id;
console.log(id);
if (id.slice(0,6)=='slide_') {
slides[id.slice(6)]=rects[i]
rects[i].scale_x = d3.scale.linear().range([rects[i].x.baseVal.value,rects[i].x.baseVal.value+rects[i].width.baseVal.value]).domain([0,1000]);
rects[i].scale_y = d3.scale.linear().range([rects[i].y.baseVal.value,rects[i].y.baseVal.value+rects[i].height.baseVal.value]).domain([0,1000]);
}
}
keys = Object.keys(slides).sort();
slides.keys = keys;
function next_slide() {
svg.transition().duration(delay).attr("viewBox",slides[keys[slide]].x.baseVal.value+" "+slides[keys[slide]].y.baseVal.value+" "+slides[keys[slide]].width.baseVal.value+" "+slides[keys[slide]].height.baseVal.value);
}
d3.select("body").on("touchmove", function() { if(slide<keys.length-1) {slide++; console.log(slide);}});
d3.select(window).on("keydown", function() {
switch (d3.event.keyCode) {
case 37: {if (slide>0) {slide=slide-1; console.log(slide);next_slide()};break}
case 39: {if(slide<keys.length-1) {slide++; console.log(slide);next_slide()};break}
case 36: {slide = 0;next_slide();break}
case 35: {slide = keys.length -1; next_slide();break}
}
});
// Start with the first slide
next_slide();
return slides
}
Display the source blob
Display the rendered blob
Raw
test.svg
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:osb="http://www.openswatchbook.org/uri/2009/osb"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="1052.36"
height="744.09003"
id="svg2"
version="1.1"
inkscape:version="0.48.2 r9819"
sodipodi:docname="test2.svg">
<defs
id="defs4">
<linearGradient
id="linearGradient3779"
osb:paint="solid">
<stop
style="stop-color:#ffffff;stop-opacity:1;"
offset="0"
id="stop3781" />
</linearGradient>
</defs>
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="0.98994949"
inkscape:cx="520.12813"
inkscape:cy="80.053504"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="1280"
inkscape:window-height="972"
inkscape:window-x="-8"
inkscape:window-y="-8"
inkscape:window-maximized="1"
showguides="false" />
<metadata
id="metadata7">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title />
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,0)">
<rect
style="fill:none;stroke:none"
id="slide_6"
width="927.06183"
height="746.22504"
x="78.847794"
y="298.08136"
inkscape:label="#rect3777" />
<flowRoot
xml:space="preserve"
id="flowRoot3789"
style="font-size:40px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"><flowRegion
id="flowRegion3791"><rect
id="rect3793"
width="213.64726"
height="115.66247"
x="356.58386"
y="571.02448" /></flowRegion><flowPara
id="flowPara3795" /></flowRoot> <text
xml:space="preserve"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="361.63461"
y="578.09558"
id="text3797"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3799"
x="361.63461"
y="578.09558" /></text>
<flowRoot
xml:space="preserve"
id="flowRoot3801"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"><flowRegion
id="flowRegion3803"><rect
id="rect3805"
width="183.34268"
height="110.6117"
x="376.7869"
y="574.56006" /></flowRegion><flowPara
id="flowPara3807" /></flowRoot> <flowRoot
xml:space="preserve"
id="flowRoot3867"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"><flowRegion
id="flowRegion3869"><rect
id="rect3871"
width="15.657365"
height="8.586297"
x="266.1752"
y="263.43304" /></flowRegion><flowPara
id="flowPara3873" /></flowRoot> <flowRoot
xml:space="preserve"
id="flowRoot3910"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"><flowRegion
id="flowRegion3912"><rect
id="rect3914"
width="195.96959"
height="97.479721"
x="313.65237"
y="366.4686" /></flowRegion><flowPara
id="flowPara3916" /></flowRoot> <flowRoot
xml:space="preserve"
id="flowRoot3927"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"><flowRegion
id="flowRegion3929"><rect
id="rect3931"
width="200.01021"
height="107.58125"
x="311.12698"
y="360.91275" /></flowRegion><flowPara
id="flowPara3933" /></flowRoot> <rect
style="fill:#ffffff;stroke:#000000;stroke-width:1.23192263"
id="slide_1"
width="213.13286"
height="152.40985"
x="283.69193"
y="534.05963"
inkscape:label="#rect2985" />
<rect
style="fill:#ffffff;stroke:#000000"
id="slide_2.1"
width="251.42857"
height="151.42857"
x="588.08197"
y="630.68048"
inkscape:label="#rect2987" />
<rect
style="fill:#ffffff;stroke:#000000;stroke-width:0.95687521"
id="slide_3"
width="234.32884"
height="150.04312"
x="265.50507"
y="744.45441"
inkscape:label="#rect2989" />
<text
xml:space="preserve"
style="font-size:18px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="353.49954"
y="765.80719"
id="text3005"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3007"
x="353.49954"
y="765.80719">Slide 3</tspan></text>
<text
xml:space="preserve"
style="font-size:18px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="678.60321"
y="661.50439"
id="text3005-1"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3007-7"
x="678.60321"
y="661.50439">Slide 2</tspan></text>
<text
xml:space="preserve"
style="font-size:18px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="357.95425"
y="566.61926"
id="text3005-8"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3007-8"
x="357.95425"
y="566.61926">Slide 1</tspan></text>
<text
xml:space="preserve"
style="font-size:2px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="634.71777"
y="744.79596"
id="text3879"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
x="634.71777"
y="744.79596"
id="tspan3883">Random scribble</tspan></text>
<rect
style="opacity:0;fill:none;stroke:#000000;stroke-width:1.32380044;stroke-opacity:1"
id="slide_2.2"
width="75.437637"
height="32.00108"
x="605.07025"
y="736.82806"
inkscape:label="#rect3887" />
<path
sodipodi:type="arc"
style="opacity:0;fill:none;stroke:#000000;stroke-width:0.2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
id="path3957-5-1"
sodipodi:cx="124.75384"
sodipodi:cy="184.64114"
sodipodi:rx="2.0203052"
sodipodi:ry="1.5152289"
d="m 126.77414,184.64114 a 2.0203052,1.5152289 0 1 1 -4.04061,0 2.0203052,1.5152289 0 1 1 4.04061,0 z"
transform="translate(503.74816,513.5077)" />
<path
style="fill:none;stroke:#000000;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none"
d="m 632.18256,755.85903 c -0.6734,1.17852 -1.2059,2.44966 -2.0203,3.53554 -0.7142,0.95238 -1.6836,1.68359 -2.5253,2.52538 -0.3368,0.33672 -0.614,0.74601 -1.0102,1.01015 -0.8706,0.58037 -0.7635,0.50508 -1.5152,0.50508 -0.1684,0 -0.3861,0.11905 -0.5051,0 -0.1191,-0.11905 0,-0.33672 0,-0.50508 0,-1.13107 0,-1.24997 0,-2.52538 0,-0.50508 -0.1876,-1.04628 0,-1.51523 0.1768,-0.44213 0.7244,-0.6292 1.0101,-1.01015 0.2259,-0.30117 0.27,-0.71619 0.5051,-1.01015 1.5997,-1.99963 1.2139,-1.07214 3.0305,-2.52538 1.6511,-1.32088 0.4126,-1.14769 3.0304,-2.02031 0.3195,-0.10648 0.6735,0 1.0102,0 0.3367,0 0.6734,0 1.0101,0 0.6931,0 1.6352,-0.26515 2.0204,0.50508 0.075,0.15058 0,0.33671 0,0.50507 0,0.33672 0,0.67344 0,1.01016 0,1.75332 0.3571,1.15808 -0.5051,2.0203 -0.1684,0.16836 -0.2694,0.53875 -0.5051,0.50508 -1.0541,-0.15059 -2.1786,-1.64903 -3.0305,-1.01016 -0.7253,0.54399 1.1592,1.63108 1.0102,2.52539 -0.1232,0.73897 -3.0154,0.50507 -3.5355,0.50507 -0.8418,0 -1.6951,0.13839 -2.5254,0 -0.5252,-0.0875 -1.0102,-0.33672 -1.5153,-0.50507 -1.1195,-0.3732 -2.5331,-0.84697 -3.5355,-1.51523 -0.6948,-0.46323 -0.5194,-0.77919 -1.0101,-1.51523 -0.3066,-0.45978 -1.2914,-1.06756 -1.5153,-1.51523 -0.075,-0.15059 0,-0.33672 0,-0.50508 0,-0.44895 -0.119,-0.80211 0.5051,-1.01015 0.3194,-0.10648 0.68,0.066 1.0102,0 4.1225,-0.82451 -2.146,-0.50508 4.5456,-0.50508 1.1786,0 2.3571,0 3.5356,0 1.1785,0 2.3596,-0.0784 3.5355,0 1.3544,0.0903 2.7017,0.28193 4.0406,0.50508 1.6936,0.28226 3.422,0.46721 5.0508,1.01015 0.9313,0.31044 1.6317,1.10901 2.5254,1.51523 0.9432,0.42873 2.7947,0.40408 3.5355,1.51523 0.6557,0.98349 0.5051,0.92691 0.5051,2.02031 0,0.16835 0,0.67343 0,0.50507 0,-0.41289 -0.085,-3.27954 0,-3.53553 0.075,-0.22588 0.3986,-0.29212 0.5051,-0.50508 0.3483,-0.69668 -0.6117,-0.45177 0.505,-1.01015 0.1537,-0.0769 1.2878,0 1.5153,0 0.1683,0 0.386,-0.11905 0.505,0 0.1191,0.11905 0,0.33672 0,0.50508 0,0.42762 0.091,1.74877 0,2.0203 -0.075,0.22588 -0.3986,0.29212 -0.505,0.50508 -0.075,0.15058 0.119,0.38603 0,0.50507 -0.2662,0.2662 -0.6735,0.33672 -1.0102,0.50508 -0.7508,0.3754 -1.6932,0.90613 -2.5254,1.01015 -0.9619,0.12024 -3.8365,0 -5.0507,0 -0.1344,0 -1.4736,0.0834 -1.5153,0 -0.1505,-0.30117 0,-0.67343 0,-1.01015 0,-1.31566 -0.119,0.0225 1.5153,-2.02031 0.9995,-1.24944 -0.1678,-1.29095 2.0203,-2.0203 0.4791,-0.15972 1.036,0.15972 1.5152,0 0.1597,-0.0532 -0.119,-0.38603 0,-0.50508 0.2662,-0.2662 0.6606,-0.36526 1.0102,-0.50507 1.4824,-0.59297 1.6106,-0.50508 3.0304,-0.50508 0.3367,0 0.6734,0 1.0102,0 0.1683,0 0.386,-0.11905 0.505,0 0.1191,0.11905 0,0.33672 0,0.50508 0,0.33179 0.059,1.90153 0,2.0203 -0.2129,0.42592 -0.6486,0.70025 -1.0101,1.01015 -1.6365,1.40269 -2.5927,2.29807 -4.5457,3.03046 -0.65,0.24374 -1.3703,0.26134 -2.0203,0.50508 -0.705,0.26437 -1.3283,0.71356 -2.0203,1.01015 -1.5984,0.68502 -2.4094,0.50508 -4.0406,0.50508 -0.5051,0 -1.0253,0.1225 -1.5152,0 -0.231,-0.0577 -0.3368,-0.33672 -0.5051,-0.50508 -0.1684,-0.16836 -0.3986,-0.29212 -0.5051,-0.50508 -0.075,-0.15058 0.093,-0.36499 0,-0.50507 -0.2641,-0.39622 -0.7003,-0.6486 -1.0102,-1.01015 -0.7015,-0.8185 -2.1393,-1.45396 -2.0203,-2.52539 0.1191,-1.07142 1.663,-1.37349 2.5254,-2.0203 2.4822,-1.86163 0.5669,-0.34012 2.5254,-1.51523 0.5205,-0.31231 0.9263,-0.86293 1.5152,-1.01015 0.8167,-0.20417 1.6836,0 2.5254,0 0.688,0 5.9061,0 6.0609,0 1.0102,0 2.0203,0 3.0305,0 0.8418,0 1.6999,-0.16509 2.5254,0 0.889,0.1778 1.6652,0.72345 2.5253,1.01015 0.6586,0.21951 1.3529,0.31438 2.0204,0.50508 0.5119,0.14626 1.0101,0.33671 1.5152,0.50507 0.5051,0.16836 1.0722,0.20976 1.5152,0.50508 0.1401,0.0934 0,0.33672 0,0.50508 0,0.16835 0,0.33671 0,0.50507 0,0.16836 0,0.33672 0,0.50508 0,0.16836 0.1191,0.38603 0,0.50507 -0.119,0.11905 -0.4298,0.15059 -0.5051,0 -0.1505,-0.30116 0,-0.67343 0,-1.01015 0,-0.33672 0,-0.67343 0,-1.01015 0,-0.50508 -0.1989,-1.05099 0,-1.51523 0.3316,-0.77373 1.0483,-1.31989 1.5153,-2.0203 0.2088,-0.31324 0.3367,-0.67344 0.505,-1.01016 0.3368,-0.33671 0.7245,-0.6292 1.0102,-1.01015 0.8979,-1.19722 -0.056,-0.99145 1.5152,-1.51523 0.1109,-0.037 1.9452,-0.0375 2.0203,0 0.213,0.10648 0.3986,0.29212 0.5051,0.50508 1.0382,2.07638 0.1508,0.90504 0.5051,3.03046 0.088,0.52515 0.4175,0.99007 0.5051,1.51522 0.083,0.49821 0,1.01016 0,1.51523 0,1.45274 0.1716,2.68726 -0.5051,4.04061 -0.1065,0.21296 -0.3367,0.33672 -0.5051,0.50508 -0.3367,0.33672 -0.6139,0.74601 -1.0101,1.01015 -0.1401,0.0934 -0.3454,-0.0532 -0.5051,0 -3.6585,1.21949 0.7963,-0.14561 -1.5153,1.01015 -0.1876,0.0938 -3.1046,0 -3.5355,0 -0.1225,0 -1.499,0.0163 -1.5152,0 -0.1191,-0.11904 0.119,-0.38602 0,-0.50507 -0.6735,-0.67344 -0.5051,0.84179 -0.5051,-0.50508 0,-0.16836 0,-0.67343 0,-0.50507 0,2.00919 -0.4155,2.39105 -1.5152,4.04061 -0.3367,0.50507 -0.5809,1.08599 -1.0102,1.51523 -0.2662,0.26619 -0.6873,0.31138 -1.0101,0.50507 -0.255,0.153 -1.9481,1.39978 -2.5254,1.51523 -0.4953,0.099 -1.0102,0 -1.5152,0 -1.3469,0 -2.6938,0 -4.0406,0 -0.6735,0 -1.3469,0 -2.0204,0 -0.6734,0 -1.4428,0.34648 -2.0203,0 -0.4565,-0.27392 -0.1856,-1.08931 -0.505,-1.51523 -0.2259,-0.30117 -0.744,-0.23888 -1.0102,-0.50507 -0.4292,-0.42924 -0.5361,-1.13603 -1.0101,-1.51523 -0.4158,-0.33259 -1.0723,-0.20976 -1.5153,-0.50508 -0.5943,-0.39621 -0.9574,-1.06902 -1.5152,-1.51523 -0.294,-0.23517 -0.709,-0.2792 -1.0101,-0.50508 -0.381,-0.28571 -0.6735,-0.67343 -1.0102,-1.01015 -1.0102,-1.01015 -1.9399,-2.10768 -3.0305,-3.03046 -1.1056,-0.9355 -2.3769,-1.65641 -3.5355,-2.52538 -0.9573,-0.71795 -0.2484,-0.9246 -2.0203,-1.51523 -0.4792,-0.15971 -1.017,0.083 -1.5152,0 -1.0503,-0.17505 -1.9975,-0.7519 -3.0305,-1.01015 -0.4276,-0.1069 -1.4959,0 -2.0203,0 -0.5791,0 -1.4971,-0.1308 -2.0203,0 -0.3652,0.0913 -0.653,0.38603 -1.0101,0.50508 -0.1598,0.0532 -0.3545,-0.0753 -0.5051,0 -0.213,0.10648 -0.2792,0.42978 -0.5051,0.50507 -0.3194,0.10648 -0.709,-0.15058 -1.0102,0 -0.1505,0.0753 0.075,0.3545 0,0.50508 -0.1064,0.21296 -0.2921,0.3986 -0.505,0.50508 -0.3012,0.15058 -0.7721,-0.2381 -1.0102,0 -0.119,0.11904 0.1191,0.38603 0,0.50507 -0.119,0.11905 -0.386,-0.11904 -0.5051,0 -0.045,0.0453 -0.026,1.50228 0,1.51523 0.3012,0.15059 0.6908,-0.10648 1.0102,0 0.2259,0.0753 0.307,0.37301 0.5051,0.50508 0.3132,0.20882 0.6734,0.33672 1.0101,0.50507 0.3367,0.16836 0.653,0.38603 1.0102,0.50508 0.6585,0.21951 1.3468,0.33672 2.0203,0.50508 1.0101,0.33671 2.0298,0.64626 3.0304,1.01015 0.8521,0.30984 1.6459,0.79026 2.5254,1.01015 1.155,0.28874 2.3589,0.32406 3.5356,0.50508 1.0121,0.15572 2.0114,0.40317 3.0304,0.50507 0.6701,0.067 1.3469,0 2.0203,0 1.6836,0 3.3672,0 5.0508,0 1.3468,0 2.7041,0.16706 4.0406,0 4.8924,-0.61155 -0.9511,-0.50507 2.5254,-0.50507"
id="path3157"
inkscape:connector-curvature="0" />
<text
xml:space="preserve"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="641.77338"
y="692.36462"
id="text3945-7-4-4"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3947-6-0-2"
x="641.77338"
y="692.36462">Here is a bullet point (1) </tspan></text>
<text
xml:space="preserve"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="641.77338"
y="702.97119"
id="text3949-1-9-3"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3951-4-4-2"
x="641.77338"
y="702.97119">Here is another one</tspan></text>
<text
xml:space="preserve"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="641.59479"
y="713.63916"
id="text3953-2-8-2"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3955-3-8-1"
x="641.59479"
y="713.63916">Here is the final point </tspan></text>
<path
transform="translate(306.04281,306.32951)"
sodipodi:type="arc"
style="fill:#000080;fill-opacity:1;stroke:#000080;stroke-width:0.80000001;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
id="path3059-2-6"
sodipodi:cx="330.625"
sodipodi:cy="383.43362"
sodipodi:rx="1.1607143"
sodipodi:ry="1.25"
d="m 331.78571,383.43362 a 1.1607143,1.25 0 1 1 -2.32142,0 1.1607143,1.25 0 1 1 2.32142,0 z" />
<path
transform="translate(306.1321,317.04381)"
sodipodi:type="arc"
style="fill:#000080;fill-opacity:1;stroke:#000080;stroke-width:0.80000001;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
id="path3059-1-4-8"
sodipodi:cx="330.625"
sodipodi:cy="383.43362"
sodipodi:rx="1.1607143"
sodipodi:ry="1.25"
d="m 331.78571,383.43362 a 1.1607143,1.25 0 1 1 -2.32142,0 1.1607143,1.25 0 1 1 2.32142,0 z" />
<path
transform="translate(306.31067,327.93671)"
sodipodi:type="arc"
style="fill:#000080;fill-opacity:1;stroke:#000080;stroke-width:0.80000001;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
id="path3059-7-5-5"
sodipodi:cx="330.625"
sodipodi:cy="383.43362"
sodipodi:rx="1.1607143"
sodipodi:ry="1.25"
d="m 331.78571,383.43362 a 1.1607143,1.25 0 1 1 -2.32142,0 1.1607143,1.25 0 1 1 2.32142,0 z" />
<text
xml:space="preserve"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="335.70218"
y="603.79321"
id="text3945-7-4-7"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3947-6-0-6"
x="335.70218"
y="603.79321">Press right-arrow for next slide</tspan></text>
<text
xml:space="preserve"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="335.70218"
y="614.39978"
id="text3949-1-9-1"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3951-4-4-8"
x="335.70218"
y="614.39978">Press left-arrow to back one slide</tspan></text>
<text
xml:space="preserve"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="335.52359"
y="625.06775"
id="text3953-2-8-9"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3955-3-8-2"
x="335.52359"
y="625.06775">END for last slide and HOME for first slide</tspan></text>
<path
transform="translate(-0.02862724,217.75806)"
sodipodi:type="arc"
style="fill:#000080;fill-opacity:1;stroke:#000080;stroke-width:0.80000001;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
id="path3059-2-7"
sodipodi:cx="330.625"
sodipodi:cy="383.43362"
sodipodi:rx="1.1607143"
sodipodi:ry="1.25"
d="m 331.78571,383.43362 a 1.1607143,1.25 0 1 1 -2.32142,0 1.1607143,1.25 0 1 1 2.32142,0 z" />
<path
transform="translate(0.06066276,228.47236)"
sodipodi:type="arc"
style="fill:#000080;fill-opacity:1;stroke:#000080;stroke-width:0.80000001;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
id="path3059-1-4-9"
sodipodi:cx="330.625"
sodipodi:cy="383.43362"
sodipodi:rx="1.1607143"
sodipodi:ry="1.25"
d="m 331.78571,383.43362 a 1.1607143,1.25 0 1 1 -2.32142,0 1.1607143,1.25 0 1 1 2.32142,0 z" />
<path
transform="translate(0.23923276,239.36526)"
sodipodi:type="arc"
style="fill:#000080;fill-opacity:1;stroke:#000080;stroke-width:0.80000001;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
id="path3059-7-5-54"
sodipodi:cx="330.625"
sodipodi:cy="383.43362"
sodipodi:rx="1.1607143"
sodipodi:ry="1.25"
d="m 331.78571,383.43362 a 1.1607143,1.25 0 1 1 -2.32142,0 1.1607143,1.25 0 1 1 2.32142,0 z" />
<path
sodipodi:type="arc"
style="fill:none;stroke:#1f8000;stroke-width:25;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
id="path3830"
sodipodi:cx="546.42859"
sodipodi:cy="377.66147"
sodipodi:rx="415"
sodipodi:ry="307.85715"
d="m 961.42859,377.66147 a 415,307.85715 0 1 1 -830,0 415,307.85715 0 1 1 830,0 z"
transform="translate(-1.4285745,341.12929)" />
<text
xml:space="preserve"
style="font-size:72px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="308.57144"
y="365.21933"
id="text3832"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3834"
x="308.57144"
y="365.21933">The big picture</tspan></text>
<text
xml:space="preserve"
style="font-size:6px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="373.92856"
y="822.00507"
id="text3840"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3842"
x="373.92856"
y="822.00507">Here</tspan></text>
<flowRoot
xml:space="preserve"
id="flowRoot3119"
style="font-size:500px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"><flowRegion
id="flowRegion3121"><rect
id="rect3123"
width="382.84781"
height="389.91888"
x="310.11682"
y="504.68387"
style="font-size:500px" /></flowRegion><flowPara
id="flowPara3125">Z</flowPara></flowRoot> <text
xml:space="preserve"
style="font-size:63.63902283px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;opacity:0.17256637;fill:#144cf8;fill-opacity:1;stroke:none;font-family:Wide Latin;-inkscape-font-specification:Wide Latin"
x="484.80231"
y="1058.8318"
id="text3131"
sodipodi:linespacing="125%"
transform="scale(1.0528103,0.94983875)"><tspan
sodipodi:role="line"
id="tspan3133"
x="484.80231"
y="1058.8318">Z</tspan></text>
</g>
</svg>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment