char and scroll to zoom

master
km0 2 years ago
parent ea4e7f528d
commit 504516ced5

1
.gitignore vendored

@ -0,0 +1 @@
samples/

@ -1,26 +1,76 @@
<svg width="1000" height="1000" viewBox="0 0 1000 1000" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="1000" height="1000" fill="#E5E5E5"/>
<g id="atlas-map">
<g id="design">
<path id="design_2" d="M999.5 500C999.5 775.866 775.866 999.5 500 999.5C224.134 999.5 0.5 775.866 0.5 500C0.5 224.134 224.134 0.5 500 0.5C775.866 0.5 999.5 224.134 999.5 500Z" stroke="black"/>
<path d="M1000 500C1000 776.142 776.142 1000 500 1000C223.858 1000 0 776.142 0 500C0 223.858 223.858 0 500 0C776.142 0 1000 223.858 1000 500Z"/>
<path d="M1000 500C1000 776.142 776.142 1000 500 1000C223.858 1000 0 776.142 0 500C0 223.858 223.858 0 500 0C776.142 0 1000 223.858 1000 500Z" stroke="black" stroke-width="2" mask="url(#path-1-inside-1_0_1)"/>
</g>
<g id="act-I">
<circle id="stream_3.mp3" cx="160.5" cy="132.5" r="17.5" fill="#FF6347"/>
<circle id="stream_2.mp3" cx="153.5" cy="229.5" r="17.5" fill="#FF6347"/>
<circle id="stream_1.mp3" cx="239.5" cy="280.5" r="17.5" fill="#FF6347"/>
<circle id="stream_0.mp3" cx="152.5" cy="378.5" r="17.5" fill="#FF6347"/>
<g id="act1">
<circle id="stream_02.mp3" cx="637.865" cy="63.8644" r="54.8068" transform="rotate(-10.484 637.865 63.8644)" fill="#FFF739"/>
<ellipse id="stream_07.mp3" cx="245.953" cy="315.791" rx="55.3287" ry="54.8068" transform="rotate(-10.484 245.953 315.791)" fill="#FFF739"/>
<circle id="stream_06.mp3" cx="106.864" cy="312.864" r="54.8068" transform="rotate(-10.484 106.864 312.864)" fill="#FFF739"/>
<ellipse id="stream_03.mp3" cx="207.312" cy="425.392" rx="54.8068" ry="55.3287" transform="rotate(-10.484 207.312 425.392)" fill="#FFF739"/>
<circle id="stream_01.mp3" cx="506.865" cy="92.8644" r="54.8068" transform="rotate(-10.484 506.865 92.8644)" fill="#FFF739"/>
<ellipse id="stream_10.mp3" cx="182.813" cy="548.302" rx="55.3287" ry="54.8068" transform="rotate(-10.484 182.813 548.302)" fill="#FFF739"/>
<circle id="stream_08.mp3" cx="350.865" cy="150.864" r="54.8068" transform="rotate(-10.484 350.865 150.864)" fill="#FFF739"/>
<ellipse id="stream_09.mp3" cx="313.222" cy="492.849" rx="54.8068" ry="55.3287" transform="rotate(-10.484 313.222 492.849)" fill="#FFF739"/>
<circle id="stream_05.mp3" cx="562.865" cy="265.864" r="54.8068" transform="rotate(-10.484 562.865 265.864)" fill="#FFF739"/>
<ellipse id="stream_04.mp3" cx="395.393" cy="250.96" rx="55.3287" ry="54.8068" transform="rotate(-10.484 395.393 250.96)" fill="#FFF739"/>
</g>
<g id="grande-finale">
<circle id="u.wav" cx="514" cy="600" r="5" fill="#898989"/>
<circle id="t.wav" cx="471" cy="755" r="5" fill="#898989"/>
<circle id="s.wav" cx="575" cy="829" r="5" fill="#898989"/>
<circle id="r.wav" cx="496" cy="917" r="5" fill="#898989"/>
<circle id="q.wav" cx="166" cy="509" r="5" fill="#898989"/>
<circle id="p.wav" cx="101" cy="639" r="5" fill="#898989"/>
<circle id="o.wav" cx="395" cy="572" r="5" fill="#898989"/>
<circle id="n.wav" cx="390" cy="430" r="5" fill="#898989"/>
<circle id="m.wav" cx="787" cy="182" r="5" fill="#898989"/>
<circle id="l.wav" cx="386" cy="696" r="5" fill="#898989"/>
<circle id="k.wav" cx="919" cy="360" r="5" fill="#898989"/>
<circle id="j.wav" cx="765" cy="411" r="5" fill="#898989"/>
<circle id="i.wav" cx="679" cy="553" r="5" fill="#898989"/>
<circle id="h.wav" cx="257" cy="591" r="5" fill="#898989"/>
<circle id="g.wav" cx="382" cy="162" r="5" fill="#898989"/>
<circle id="f.wav" cx="257" cy="349" r="5" fill="#898989"/>
<circle id="e.wav" cx="63" cy="421" r="5" fill="#898989"/>
<circle id="d.wav" cx="400" cy="253" r="5" fill="#898989"/>
<circle id="c.wav" cx="773" cy="721" r="5" fill="#898989"/>
<circle id="b.wav" cx="206" cy="792" r="5" fill="#898989"/>
<circle id="b.wav" cx="787" cy="491" r="5" fill="#898989"/>
<circle id="a.wav" cx="606" cy="112" r="5" fill="#898989"/>
</g>
<g id="entr&#39;acte_3">
<circle id="sample8_Entracte3.mp3" cx="882.5" cy="481.5" r="12.5" fill="#FF6347"/>
<circle id="sample6_Entracte3.mp3" cx="830.5" cy="250.5" r="12.5" fill="#FF6347"/>
<circle id="sample3_Entracte3.mp3" cx="703.5" cy="332.5" r="12.5" fill="#FF6347"/>
<circle id="sample7_Entracte3.mp3" cx="618.5" cy="265.5" r="12.5" fill="#FF6347"/>
<circle id="sample4_Entracte3.mp3" cx="703.5" cy="418.5" r="12.5" fill="#FF6347"/>
<circle id="sample2_Entracte3.mp3" cx="790.5" cy="338.5" r="12.5" fill="#FF6347"/>
<circle id="sample5_Entracte3.mp3" cx="855.5" cy="398.5" r="12.5" fill="#FF6347"/>
<circle id="sample1_Entracte3.mp3" cx="626.5" cy="357.5" r="12.5" fill="#FF6347"/>
</g>
<g id="entracte_2">
<circle id="sample6_Entracte_2_2.mp3" cx="420.5" cy="924.5" r="12.5" fill="#FF47F8"/>
<circle id="sample5_Entracte_2_2.mp3" cx="709.5" cy="874.5" r="12.5" fill="#FF47F8"/>
<circle id="sample4_Entracte_2_2.mp3" cx="641.5" cy="788.5" r="12.5" fill="#FF47F8"/>
<circle id="sample3_Entracte_2_2.mp3" cx="565.5" cy="924.5" r="12.5" fill="#FF47F8"/>
<circle id="sample2_Entracte_2_2.mp3" cx="499.5" cy="806.5" r="12.5" fill="#FF47F8"/>
<circle id="sample1_Entracte_2_2.mp3" cx="773.5" cy="781.5" r="12.5" fill="#FF47F8"/>
</g>
<g id="entr&#39;acte_1">
<circle id="sample4_Entracte_1.mp3" cx="342.5" cy="413.5" r="17.5" fill="#1E90FF"/>
<circle id="sample3_Entracte_1.mp3" cx="673.5" cy="491.5" r="17.5" fill="#1E90FF"/>
<circle id="sample2_Entracte_1.mp3" cx="517.5" cy="588.5" r="17.5" fill="#1E90FF"/>
<circle id="sample1_Entracte_1.mp3" cx="102.5" cy="315.5" r="17.5" fill="#1E90FF"/>
<circle id="sample5_Entracte_1.mp3" cx="148.5" cy="442.5" r="12.5" fill="#FFB547"/>
<circle id="sample4_Entracte_1.mp3" cx="408.5" cy="342.5" r="12.5" fill="#FFB547"/>
<circle id="sample3_Entracte_1.mp3" cx="320.5" cy="535.5" r="12.5" fill="#FFB547"/>
<circle id="sample2_Entracte_1.mp3" cx="178.5" cy="675.5" r="12.5" fill="#FFB547"/>
<circle id="sample1_Entracte_1.mp3" cx="213.5" cy="255.5" r="12.5" fill="#FFB547"/>
</g>
<g id="grande-finale">
<circle id="e.wav" cx="278" cy="212" r="18" fill="#C4C4C4"/>
<circle id="d.wav" cx="496" cy="347" r="16" fill="#C4C4C4"/>
<circle id="c.wav" cx="297" cy="668" r="22" fill="#C4C4C4"/>
<circle id="b.wav" cx="581.5" cy="816.5" r="18.5" fill="#C4C4C4"/>
<circle id="a.wav" cx="517.5" cy="167.5" r="17.5" fill="#C4C4C4"/>
<g id="act3">
<circle id="voice-hierarchy-week03.mp3" cx="853.5" cy="607.5" r="93.5" fill="#C5FF1E"/>
</g>
<g id="act2">
<circle id="Laughing-Opera-Soprano-Violet-Duet.wav" cx="325" cy="787" r="89" fill="#1E90FF"/>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 5.0 KiB

File diff suppressed because it is too large Load Diff
Loading…
Cancel
Save