SVGCanvas
's SVG-specific Extensions
starting at
going to
/
7
0: pollygon
function(c) { c.translate(200/12,200/12); for (i=0;i<6;i++){ for (j=0;j<6;j++){ c.strokeStyle = 'rgb(0,' + Math.floor(255-42.5*i) + ',' + Math.floor(255-42.5*j) + ')'; c.save(); c.translate(i*200/6,j*200/6); c.pollygon(i+3, 10+10/(j+1), Math.PI/6/(i+3)*j); c.stroke(); c.restore(); } } }
<svg baseProfile="full" height="200" version="1.1" width="200" xmlns="http://www.w3.org/2000/svg" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <path d=" M 1.0744838458443006e-15,-17.547653198242188 L 15.1967134475708,8.773826599121094 L -15.1967134475708,8.773826599121094 Z" fill="none" stroke="#00ffff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 2.2853386402130127,20.37253189086914 L 10.081711769104004,41.79289245605469 L -12.367050170898438,37.834571838378906 Z" fill="none" stroke="#00ffd4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 4.001100540161133,55.673728942871094 L 7.519609451293945,75.62818908691406 L -11.520709991455078,68.69807434082031 Z" fill="none" stroke="#00ffaa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 5.483641624450684,90.5020523071289 L 5.483641624450684,109.4979476928711 L -10.967283248901367,100 Z" fill="none" stroke="#00ff7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 6.767648696899414,125.26795959472656 L 3.6009905338287354,143.2269744873047 L -10.36863899230957,131.5050506591797 Z" fill="none" stroke="#00ff55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 7.841331481933594,160.08700561523438 L 1.7774854898452759,176.74729919433594 L -9.618817329406738,163.16571044921875 Z" fill="none" stroke="#00ff2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 33.33333206176758,-14.142135620117188 L 47.475467681884766,0 L 33.33333206176758,14.142135620117188 L 19.19119644165039,1.7319120677457517e-15 Z" fill="none" stroke="#00d4ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 34.717769622802734,22.81747055053711 L 43.84919357299805,34.717769622802734 L 31.94889259338379,43.84919357299805 L 22.81747055053711,31.94889259338379 Z" fill="none" stroke="#00d4d4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 35.773502349853516,57.55982971191406 L 42.44017028808594,69.1068344116211 L 30.89316177368164,75.77349853515625 L 24.22649574279785,64.22649383544922 Z" fill="none" stroke="#00d4aa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 36.7158088684082,91.833984375 L 41.499351501464844,103.38247680664062 L 29.950857162475586,108.166015625 L 25.167312622070312,96.61752319335938 Z" fill="none" stroke="#00d47f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 37.57597351074219,125.98485565185547 L 40.681800842285156,137.5759735107422 L 29.09069061279297,140.68179321289062 L 25.98486328125,129.09068298339844 Z" fill="none" stroke="#00d455" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 38.3553581237793,160.12184143066406 L 39.8781623840332,171.68869018554688 L 28.31130599975586,173.2115020751953 L 26.788501739501953,161.6446533203125 Z" fill="none" stroke="#00d42a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 66.66666412353516,-12.970502853393555 L 79.00234985351562,-4.008105754852295 L 74.29053497314453,10.49335765838623 L 59.04279327392578,10.49335765838623 L 54.33098220825195,-4.008105754852295 Z" fill="none" stroke="#00aaff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 67.68350219726562,23.65874481201172 L 76.18196105957031,31.310792922973633 L 71.53060150146484,41.75791931152344 L 60.15744400024414,40.56255340576172 L 57.779808044433594,29.37664794921875 Z" fill="none" stroke="#00aad4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 68.4644775390625,58.2086181640625 L 75.26629638671875,65.76280975341797 L 70.1837158203125,74.56609344482422 L 60.24068832397461,72.45263671875 L 59.178138732910156,62.343162536621094 Z" fill="none" stroke="#00aaaa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 69.1717300415039,92.29019927978516 L 74.77323150634766,100 L 69.1717300415039,107.70980072021484 L 60.108314514160156,104.76492309570312 L 60.108314514160156,95.23507690429688 Z" fill="none" stroke="#00aa7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 69.8320083618164,126.22383880615234 L 74.40633392333984,134.1468048095703 L 68.28469848632812,140.94557189941406 L 59.92699432373047,137.22447204589844 L 60.88328552246094,128.12594604492188 Z" fill="none" stroke="#00aa55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 70.4497299194336,160.1142120361328 L 74.06745147705078,168.23976135253906 L 67.4575424194336,174.19134521484375 L 59.754661560058594,169.7440948486328 L 61.60393524169922,161.0439453125 Z" fill="none" stroke="#00aa2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 100,-12.408064842224121 L 110.74569702148438,-6.2040324211120605 L 110.74569702148438,6.2040324211120605 L 100,12.408064842224121 L 89.25430297851562,6.2040324211120605 L 89.25430297851562,-6.2040324211120605 Z" fill="none" stroke="#007fff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 100.81107330322266,24.062694549560547 L 108.43414306640625,29.40042495727539 L 107.6230697631836,38.67106246948242 L 99.18892669677734,42.60396957397461 L 91.56585693359375,37.266239166259766 L 92.3769302368164,27.995601654052734 Z" fill="none" stroke="#007fd4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 101.4364242553711,58.520294189453125 L 107.77317810058594,63.837459564208984 L 106.33675384521484,71.98383331298828 L 98.5635757446289,74.81303405761719 L 92.22682189941406,69.4958724975586 L 93.66324615478516,61.3494987487793 Z" fill="none" stroke="#007faa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 102.00714874267578,92.50920867919922 L 107.49079132080078,97.99285125732422 L 105.483642578125,105.483642578125 L 97.99285125732422,107.49079132080078 L 92.50920867919922,102.00714874267578 L 94.516357421875,94.516357421875 Z" fill="none" stroke="#007f7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 102.5462875366211,126.33747100830078 L 107.33173370361328,132.04054260253906 L 104.78544616699219,139.03640747070312 L 97.4537124633789,140.32919311523438 L 92.66826629638672,134.62611389160156 L 95.21455383300781,127.6302490234375 Z" fill="none" stroke="#007f55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 103.05892944335938,160.10678100585938 L 107.21049499511719,166.03582763671875 L 104.15156555175781,172.59571838378906 L 96.94107055664062,173.2265625 L 92.78950500488281,167.29751586914062 L 95.84843444824219,160.7376251220703 Z" fill="none" stroke="#007f2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 133.3333282470703,-12.090364456176758 L 142.78594970703125,-7.538218975067139 L 145.1205596923828,2.690359115600586 L 138.5791473388672,10.893041610717773 L 128.08750915527344,10.893041610717773 L 121.54609680175781,2.690359115600586 L 123.88069915771484,-7.538218975067139 Z" fill="none" stroke="#0055ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 134.01097106933594,24.290912628173828 L 140.82546997070312,28.22527313232422 L 141.9982452392578,36.006103515625 L 136.6461639404297,41.77428436279297 L 128.7994384765625,41.18625259399414 L 124.36683654785156,34.684814453125 L 126.6861801147461,27.165679931640625 Z" fill="none" stroke="#0055d4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 134.53463745117188,58.696449279785156 L 140.31370544433594,62.63654327392578 L 140.83639526367188,69.61140441894531 L 135.70912170410156,74.36881256103516 L 128.79283142089844,73.32634735107422 L 125.29562377929688,67.26900482177734 L 127.85096740722656,60.758087158203125 Z" fill="none" stroke="#0055aa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 135.01480102539062,92.63298034667969 L 140.1414794921875,96.72136688232422 L 140.1414794921875,103.27863311767578 L 135.01480102539062,107.36701965332031 L 128.6219482421875,105.90789031982422 L 125.77684783935547,100 L 128.6219482421875,94.09210968017578 Z" fill="none" stroke="#00557f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 135.47154235839844,126.40139770507812 L 140.08609008789062,130.6830596923828 L 139.61566162109375,136.96043395996094 L 134.41452026367188,140.50653076171875 L 128.39920043945312,138.6510467529297 L 126.09939575195312,132.7912139892578 L 129.24688720703125,127.33961486816406 Z" fill="none" stroke="#005555" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 135.90997314453125,160.1014862060547 L 140.0727081298828,164.5878448486328 L 139.16055297851562,170.6396026611328 L 133.86038208007812,173.6996612548828 L 128.163330078125,171.46372985839844 L 126.35939025878906,165.6155242919922 L 129.80697631835938,160.558837890625 Z" fill="none" stroke="#00552a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 166.6666717529297,-11.892070770263672 L 175.0756378173828,-8.408964157104492 L 178.55874633789062,0 L 175.0756378173828,8.408964157104492 L 166.6666717529297,11.892070770263672 L 158.25770568847656,8.408964157104492 L 154.77459716796875,1.4563586974767717e-15 L 158.25770568847656,-8.408964157104492 Z" fill="none" stroke="#002aff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 167.25,24.43337631225586 L 173.37237548828125,27.452590942382812 L 175.56663513183594,33.91666793823242 L 172.5474090576172,40.039031982421875 L 166.08334350585938,42.2332878112793 L 159.96096801757812,39.214073181152344 L 157.76670837402344,32.749996185302734 L 160.7859344482422,26.62763214111328 Z" fill="none" stroke="#002ad4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 167.7014923095703,58.80644226074219 L 172.9564208984375,61.84037399291992 L 174.52688598632812,67.70148468017578 L 171.4929656982422,72.95640563964844 L 165.63185119628906,74.52688598632812 L 160.37692260742188,71.49295043945312 L 158.80645751953125,65.63184356689453 L 161.8403778076172,60.376922607421875 Z" fill="none" stroke="#002aaa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 168.11668395996094,92.71026611328125 L 172.8466033935547,95.87069702148438 L 173.95640563964844,101.45001983642578 L 170.7959747314453,106.179931640625 L 165.21665954589844,107.28973388671875 L 160.4867401123047,104.12930297851562 L 159.37693786621094,98.54998016357422 L 162.53736877441406,93.820068359375 Z" fill="none" stroke="#002a7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 168.51341247558594,126.44121551513672 L 172.84597778320312,129.7657012939453 L 173.5587921142578,135.18006896972656 L 170.2342987060547,139.51263427734375 L 164.81993103027344,140.22544860839844 L 160.48736572265625,136.9009552001953 L 159.77455139160156,131.48658752441406 L 163.0990447998047,127.1540298461914 Z" fill="none" stroke="#002a55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 168.89651489257812,160.0977783203125 L 172.88832092285156,163.59849548339844 L 173.23556518554688,168.89651489257812 L 169.73484802246094,172.88832092285156 L 164.43682861328125,173.23556518554688 L 160.4450225830078,169.73484802246094 L 160.0977783203125,164.43682861328125 L 163.59849548339844,160.4450225830078 Z" fill="none" stroke="#002a2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> </svg>
1: star
function(c) { c.translate(200/12,200/12); for (i=0;i<6;i++){ for (j=0;j<6;j++){ c.strokeStyle = 'rgb(0,' + Math.floor(255-42.5*i) + ',' + Math.floor(255-42.5*j) + ')'; c.save(); c.translate(i*200/6,j*200/6); var outer_radius = 10+10/(j+2); var inner_radius = outer_radius/(i+1); var rotate = Math.PI/6/(i+3)*j; c.star(i+3, outer_radius, inner_radius, rotate); c.stroke(); c.restore(); } } }
<svg baseProfile="full" height="200" version="1.1" width="200" xmlns="http://www.w3.org/2000/svg" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <path d=" M 9.184850467946473e-16,-15 L 9.184850467946473e-16,-15 L 12.990381240844727,-7.5 L 12.990381240844727,7.5 L 4.249154332428354e-15,15 L -12.990381240844727,7.5 L -12.990381240844727,-7.5 Z" fill="none" stroke="#00ffff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 2.3153090476989746,20.20256233215332 L 2.3153090476989746,20.20256233215332 L 12.529234886169434,28.77306365966797 L 10.213926315307617,41.903831481933594 L -2.3153090476989746,46.46410369873047 L -12.529234886169434,37.89360046386719 L -10.213926315307617,24.76283073425293 Z" fill="none" stroke="#00ffd4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 4.275251865386963,54.92050552368164 L 4.275251865386963,54.92050552368164 L 12.310096740722656,64.49606323242188 L 8.034845352172852,76.24221801757812 L -4.275251865386963,78.4128189086914 L -12.310096740722656,68.83726501464844 L -8.034845352172852,57.09111022949219 Z" fill="none" stroke="#00ffaa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 6,89.60769653320312 L 6,89.60769653320312 L 12,100 L 6,110.39230346679688 L -6,110.39230346679688 L -12,100 L -6,89.60769653320312 Z" fill="none" stroke="#00ff7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 7.4991888999938965,124.3961410522461 L 7.4991888999938965,124.3961410522461 L 11.489423751831055,135.35922241210938 L 3.9902350902557373,144.29640197753906 L -7.4991888999938965,142.2705078125 L -11.489423751831055,131.30743408203125 L -3.9902350902557373,122.37024688720703 Z" fill="none" stroke="#00ff55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 8.754793167114258,159.32052612304688 L 8.754793167114258,159.32052612304688 L 10.739344596862793,170.57546997070312 L 1.9845505952835083,177.92161560058594 L -8.754793167114258,174.0128173828125 L -10.739344596862793,162.75787353515625 L -1.9845505952835083,155.41172790527344 Z" fill="none" stroke="#00ff2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 33.33333206176758,-15 L 33.33333206176758,-15 L 38.636634826660156,-5.303300857543945 L 48.33333206176758,0 L 38.636634826660156,5.303300857543945 L 33.33333206176758,15 L 28.030031204223633,5.303300857543945 L 18.333332061767578,1.8369700935892946e-15 L 28.030031204223633,-5.303300857543945 Z" fill="none" stroke="#00d4ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 35.07368087768555,20.11406707763672 L 35.07368087768555,20.11406707763672 L 38.622352600097656,29.274921417236328 L 46.55259704589844,35.07368087768555 L 37.39174270629883,38.622352600097656 L 31.59298324584961,46.55259704589844 L 28.044309616088867,37.39174270629883 L 20.11406707763672,31.59298324584961 L 29.274921417236328,28.044309616088867 Z" fill="none" stroke="#00d4d4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 36.56856918334961,54.59259033203125 L 36.56856918334961,54.59259033203125 L 38.74599075317383,63.541664123535156 L 45.407405853271484,69.90190124511719 L 36.45833206176758,72.0793228149414 L 30.098094940185547,78.74073791503906 L 27.920673370361328,69.79166412353516 L 21.259258270263672,63.431427001953125 L 30.208332061767578,61.254005432128906 Z" fill="none" stroke="#00d4aa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 37.925533294677734,88.91344451904297 L 37.925533294677734,88.91344451904297 L 38.876609802246094,97.70390319824219 L 44.41988754272461,104.59220123291016 L 35.629432678222656,105.54327392578125 L 28.741130828857422,111.08655548095703 L 27.790054321289062,102.29609680175781 L 22.246776580810547,95.40779876708984 L 31.0372314453125,94.45672607421875 Z" fill="none" stroke="#00d47f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 39.166664123535156,123.22969818115234 L 39.166664123535156,123.22969818115234 L 38.967899322509766,131.82354736328125 L 43.43696212768555,139.16665649414062 L 34.843109130859375,138.9678955078125 L 27.499998092651367,143.43695068359375 L 27.69876480102539,134.84310913085938 L 23.22970199584961,127.49999237060547 L 31.82355499267578,127.69876098632812 Z" fill="none" stroke="#00d455" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 40.29060363769531,157.5997772216797 L 40.29060363769531,157.5997772216797 L 38.99872970581055,165.92080688476562 L 42.40022659301758,173.6239471435547 L 34.07919692993164,172.3320770263672 L 26.37605857849121,175.7335662841797 L 27.667932510375977,167.41253662109375 L 24.266437530517578,159.7093963623047 L 32.587467193603516,161.0012664794922 Z" fill="none" stroke="#00d42a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 66.66666412353516,-15 L 66.66666412353516,-15 L 69.6055908203125,-4.0450849533081055 L 80.93251037597656,-4.635254859924316 L 71.42194366455078,1.5450849533081055 L 75.48344421386719,12.135254859924316 L 66.66666412353516,5 L 57.849884033203125,12.135254859924316 L 61.911380767822266,1.5450849533081055 L 52.40081787109375,-4.635254859924316 L 63.72773742675781,-4.0450849533081055 Z" fill="none" stroke="#00aaff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 68.06037902832031,20.073040008544922 L 68.06037902832031,20.073040008544922 L 69.64057922363281,30.030466079711914 L 79.70863342285156,30.561176300048828 L 70.72686767578125,35.14105224609375 L 73.33332824707031,44.88033676147461 L 66.20209503173828,37.7534294128418 L 57.74492263793945,43.24192810058594 L 62.31934356689453,34.25738525390625 L 54.48605728149414,27.91017723083496 L 64.44444274902344,29.484329223632812 Z" fill="none" stroke="#00aad4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 69.26556396484375,54.4398193359375 L 69.26556396484375,54.4398193359375 L 69.76309967041016,63.87862014770508 L 79.09819030761719,65.36006164550781 L 70.27510070800781,68.75 L 71.75086975097656,78.08598327636719 L 65.80036163330078,70.74227905273438 L 57.37735366821289,75.03079986572266 L 62.522823333740234,67.1021957397461 L 55.841346740722656,60.416664123535156 L 64.97193145751953,62.860225677490234 Z" fill="none" stroke="#00aaaa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 70.37487030029297,88.58732604980469 L 70.37487030029297,88.58732604980469 L 69.9027328491211,97.64885711669922 L 78.66666412353516,100 L 69.9027328491211,102.35114288330078 L 70.37487030029297,111.41267395019531 L 65.43059539794922,103.80422973632812 L 56.958457946777344,107.05342102050781 L 62.666664123535156,100 L 56.958457946777344,92.94657897949219 L 65.43059539794922,96.19577026367188 Z" fill="none" stroke="#00aa7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 71.41192626953125,122.67530059814453 L 71.41192626953125,122.67530059814453 L 70.03453826904297,131.38888549804688 L 78.26941680908203,134.55282592773438 L 69.55667114257812,135.9355010986328 L 69.09230041503906,144.74505615234375 L 65.08490753173828,136.88600158691406 L 56.56303405761719,139.16665649414062 L 62.79907989501953,132.9268341064453 L 57.99664306640625,125.52680206298828 L 65.85811614990234,129.5294189453125 Z" fill="none" stroke="#00aa55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 72.38095092773438,156.7692413330078 L 72.38095092773438,156.7692413330078 L 70.14683532714844,165.11720275878906 L 77.84549713134766,169.0428009033203 L 69.21573638916016,169.49769592285156 L 67.86127471923828,178.0326385498047 L 64.76190185546875,169.9658203125 L 56.22614288330078,171.31509399414062 L 62.94038772583008,165.8746337890625 L 59.01945877075195,158.173583984375 L 66.26846313476562,162.87802124023438 Z" fill="none" stroke="#00aa2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 100,-15 L 100,-15 L 101.875,-3.2475953102111816 L 112.9903793334961,-7.5 L 103.75,-8.326672684688674e-16 L 112.9903793334961,7.5 L 101.875,3.2475953102111816 L 100,15 L 98.125,3.2475953102111816 L 87.0096206665039,7.5 L 96.25,3.789911703151912e-15 L 87.0096206665039,-7.5 L 98.125,-3.2475953102111816 Z" fill="none" stroke="#007fff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 101.16207885742188,20.050735473632812 L 101.16207885742188,20.050735473632812 L 101.91191864013672,30.602825164794922 L 112.0841064453125,27.698421478271484 L 103.32064819335938,33.62385177612305 L 110.92202758789062,40.98101806640625 L 101.40872955322266,36.3543586730957 L 98.83792114257812,46.615928649902344 L 98.08808135986328,36.063838958740234 L 87.9158935546875,38.96824264526367 L 96.67935180664062,33.04281234741211 L 89.07797241210938,25.685646057128906 L 98.59127044677734,30.312305450439453 Z" fill="none" stroke="#007fd4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 102.17060089111328,54.3565673828125 L 102.17060089111328,54.3565673828125 L 102.00871276855469,64.27277374267578 L 111.74615478515625,62.39141082763672 L 103.07752227783203,67.20931243896484 L 109.57555389404297,74.70150756835938 L 101.06880950927734,69.60320281982422 L 97.82939910888672,78.97676086425781 L 97.99128723144531,69.06055450439453 L 88.25384521484375,70.9419174194336 L 96.92247772216797,66.12401580810547 L 90.42444610595703,58.63182067871094 L 98.93119049072266,63.730125427246094 Z" fill="none" stroke="#007faa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 103.10582733154297,88.40888977050781 L 103.10582733154297,88.40888977050781 L 102.12132263183594,97.87867736816406 L 111.59111022949219,96.89417266845703 L 102.89778137207031,100.77645874023438 L 108.48528289794922,108.48528289794922 L 100.77645874023438,102.89778137207031 L 96.89417266845703,111.59111022949219 L 97.87867736816406,102.12132263183594 L 88.40888977050781,103.10582733154297 L 97.10221862792969,99.22354125976562 L 91.51471710205078,91.51471710205078 L 99.22354125976562,97.10221862792969 Z" fill="none" stroke="#007f7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 103.990234375,122.37024688720703 L 103.990234375,122.37024688720703 L 102.23429870605469,131.45852661132812 L 111.48942565917969,131.30743408203125 L 102.74076843261719,134.3308868408203 L 107.49919128417969,142.2705078125 L 100.50647735595703,136.2056884765625 L 96.009765625,144.29640197753906 L 97.76570129394531,135.2081298828125 L 88.51057434082031,135.35922241210938 L 97.25923156738281,132.3357696533203 L 92.50080871582031,124.3961410522461 L 99.49352264404297,130.46096801757812 Z" fill="none" stroke="#007f55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 104.82992553710938,156.30886840820312 L 104.82992553710938,156.30886840820312 L 102.3404312133789,165.0278778076172 L 111.38508605957031,165.6706085205078 L 102.58944702148438,167.8741455078125 L 106.55516052246094,176.02841186523438 L 100.24901580810547,169.512939453125 L 95.17007446289062,177.02447509765625 L 97.6595687866211,168.3054656982422 L 88.61491394042969,167.66273498535156 L 97.41055297851562,165.45919799804688 L 93.44483947753906,157.304931640625 L 99.75098419189453,163.82040405273438 Z" fill="none" stroke="#007f2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 133.3333282470703,-15 L 133.3333282470703,-15 L 134.63497924804688,-2.702906608581543 L 145.06080627441406,-9.352347373962402 L 136.25811767578125,-0.6675627827644348 L 147.95724487304688,3.3378140926361084 L 135.67881774902344,1.8704694509506226 L 139.84158325195312,13.514533042907715 L 133.3333282470703,3 L 126.8250732421875,13.514533042907715 L 130.9878387451172,1.8704694509506226 L 118.70941162109375,3.3378140926361084 L 130.40853881835938,-0.6675627827644348 L 121.6058578491211,-9.352347373962402 L 132.03167724609375,-2.702906608581543 Z" fill="none" stroke="#0055ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 134.32972717285156,20.037281036376953 L 134.32972717285156,20.037281036376953 L 134.66665649414062,31.0239315032959 L 144.34983825683594,25.822399139404297 L 135.97021484375,32.93588638305664 L 146.0742950439453,37.26340103149414 L 135.2881317138672,35.147125244140625 L 138.2045440673828,45.74497985839844 L 133.13404846191406,35.9925422668457 L 126.66666412353516,44.88033676147461 L 131.13002014160156,34.83551788330078 L 120.14891815185547,35.320560455322266 L 130.78514099121094,32.54731750488281 L 123.5593032836914,24.264362335205078 L 132.3590850830078,30.851001739501953 Z" fill="none" stroke="#0055d4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 135.19635009765625,54.306278228759766 L 135.19635009765625,54.306278228759766 L 134.7416229248047,64.60106658935547 L 144.1586456298828,60.416664123535156 L 135.8263397216797,66.4798355102539 L 144.96925354003906,71.23342895507812 L 135.03375244140625,68.4992904663086 L 137.01776123046875,78.611328125 L 132.96072387695312,69.13874053955078 L 126.29182434082031,76.9946517944336 L 131.1682586669922,67.91666412353516 L 120.86827850341797,67.60079193115234 L 131.0061492919922,65.75331115722656 L 124.83116912841797,57.503517150878906 L 132.596435546875,64.2777328491211 Z" fill="none" stroke="#0055aa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 136.0035858154297,88.30086517333984 L 136.0035858154297,88.30086517333984 L 134.82969665527344,98.12360382080078 L 144.14495849609375,94.79339599609375 L 135.7333221435547,100 L 144.14495849609375,105.20660400390625 L 134.82969665527344,101.87639617919922 L 136.0035858154297,111.69913482666016 L 132.7992706298828,102.33982849121094 L 125.85144805908203,109.3819808959961 L 131.17100524902344,101.04132080078125 L 121.33332824707031,100 L 131.17100524902344,98.95867919921875 L 125.85144805908203,90.6180191040039 L 132.7992706298828,97.66017150878906 Z" fill="none" stroke="#00557f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 136.7721405029297,122.18498229980469 L 136.7721405029297,122.18498229980469 L 134.92039489746094,131.6228790283203 L 144.1935272216797,129.07101440429688 L 135.66014099121094,133.50770568847656 L 143.43695068359375,139.16665649414062 L 134.64773559570312,135.26121520996094 L 135.07215881347656,144.86968994140625 L 132.64556884765625,135.56300354003906 L 125.39797973632812,141.88560485839844 L 131.16128540039062,134.185791015625 L 121.69927978515625,132.4614715576172 L 131.31260681152344,132.16665649414062 L 126.76126098632812,123.69387817382812 L 132.98556518554688,131.02606201171875 Z" fill="none" stroke="#005555" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 137.50865173339844,156.02810668945312 L 137.50865173339844,156.02810668945312 L 135.00888061523438,165.1119842529297 L 144.25416564941406,163.29803466796875 L 135.593505859375,167.00733947753906 L 142.77606201171875,173.1046142578125 L 134.47618103027344,168.6461639404297 L 134.18739318847656,178.06329345703125 L 132.49826049804688,168.7943878173828 L 124.9555892944336,174.44007873535156 L 131.14915466308594,167.34039306640625 L 122.03240203857422,164.9633331298828 L 131.4447784423828,165.37908935546875 L 127.6190414428711,156.7692413330078 L 133.1625213623047,164.38734436035156 Z" fill="none" stroke="#00552a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 166.6666717529297,-15 L 166.6666717529297,-15 L 167.62338256835938,-2.3096988201141357 L 177.2732696533203,-10.60660171508789 L 168.9763641357422,-0.9567086100578308 L 181.6666717529297,0 L 168.9763641357422,0.9567086100578308 L 177.2732696533203,10.60660171508789 L 167.62338256835938,2.3096988201141357 L 166.6666717529297,15 L 165.7099609375,2.3096988201141357 L 156.06007385253906,10.60660171508789 L 164.3569793701172,0.9567086100578308 L 151.6666717529297,1.8369700935892946e-15 L 164.3569793701172,-0.9567086100578308 L 156.06007385253906,-10.60660171508789 L 165.7099609375,-2.3096988201141357 Z" fill="none" stroke="#002aff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 167.53871154785156,20.028545379638672 L 167.53871154785156,20.028545379638672 L 167.6495361328125,31.340282440185547 L 176.6912078857422,24.54205322265625 L 168.77096557617188,32.619022369384766 L 179.97145080566406,34.20537567138672 L 168.65972900390625,34.31619644165039 L 175.45794677734375,43.35786437988281 L 167.3809814453125,35.4376220703125 L 165.7946319580078,46.638118743896484 L 165.68380737304688,35.32638168334961 L 156.6421356201172,42.124610900878906 L 164.5623779296875,34.04764175415039 L 153.3618927001953,32.46128845214844 L 164.67361450195312,32.350467681884766 L 157.87539672851562,23.308801651000977 L 165.95236206054688,31.229042053222656 Z" fill="none" stroke="#002ad4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 168.29824829101562,54.27360534667969 L 168.29824829101562,54.27360534667969 L 167.70834350585938,64.86244201660156 L 176.58358764648438,59.05714416503906 L 168.67901611328125,66.12745666503906 L 179.0597381591797,68.2982406616211 L 168.47088623046875,67.70832824707031 L 174.27618408203125,76.58358001708984 L 167.20587158203125,68.67900848388672 L 165.03509521484375,79.05972290039062 L 165.625,68.47088623046875 L 156.749755859375,74.27618408203125 L 164.65432739257812,67.20587158203125 L 154.2736053466797,65.03508758544922 L 164.86245727539062,65.625 L 159.05715942382812,56.74974822998047 L 166.12747192382812,64.6543197631836 Z" fill="none" stroke="#002aaa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 169.00775146484375,88.23057556152344 L 169.00775146484375,88.23057556152344 L 167.77781677246094,98.3370590209961 L 176.64430236816406,93.33316040039062 L 168.62823486328125,99.60981750488281 L 178.43609619140625,102.3410873413086 L 168.32960510253906,101.11113739013672 L 173.33351135253906,109.9776382446289 L 167.05685424804688,101.9615707397461 L 164.32559204101562,111.76942443847656 L 165.55552673339844,101.6629409790039 L 156.6890411376953,106.66683959960938 L 164.70510864257812,100.39018249511719 L 154.89724731445312,97.6589126586914 L 165.0037384033203,98.88886260986328 L 159.9998321533203,90.0223617553711 L 166.2764892578125,98.0384292602539 Z" fill="none" stroke="#002a7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 169.6862335205078,122.06419372558594 L 169.6862335205078,122.06419372558594 L 167.85037231445312,131.7906951904297 L 176.77029418945312,127.49999237060547 L 168.594482421875,133.07952880859375 L 177.93580627441406,136.35289001464844 L 168.2093048095703,134.51702880859375 L 172.5,143.43695068359375 L 166.92047119140625,135.26113891601562 L 163.64710998535156,144.6024627685547 L 165.48297119140625,134.87596130371094 L 156.56304931640625,139.16665649414062 L 164.73886108398438,133.58712768554688 L 155.3975372314453,130.3137664794922 L 165.12403869628906,132.14962768554688 L 160.83334350585938,123.22969818115234 L 166.41287231445312,131.405517578125 Z" fill="none" stroke="#002a55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> <path d=" M 170.34027099609375,155.84461975097656 L 170.34027099609375,155.84461975097656 L 167.9225616455078,165.23458862304688 L 176.91664123535156,161.6119384765625 L 168.56735229492188,166.54209899902344 L 177.4887237548828,170.34027099609375 L 168.0987548828125,167.9225616455078 L 171.72140502929688,176.91664123535156 L 166.79124450683594,168.56735229492188 L 162.99307250976562,177.4887237548828 L 165.41078186035156,168.0987548828125 L 156.4167022705078,171.72140502929688 L 164.7659912109375,166.79124450683594 L 155.84461975097656,162.99307250976562 L 165.23458862304688,165.41078186035156 L 161.6119384765625,156.4167022705078 L 166.54209899902344,164.7659912109375 Z" fill="none" stroke="#002a2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"/> </svg>
2: asterisk
function(c) { c.translate(200/12,200/12); for (i=0;i<6;i++){ for (j=0;j<6;j++){ c.strokeStyle = 'rgb(0,' + Math.floor(255-42.5*i) + ',' + Math.floor(255-42.5*j) + ')'; c.save(); c.translate(i*200/6,j*200/6); var outer_radius = 10+10/(j+2); var inner_radius = outer_radius/2/(i+1); var rotate = Math.PI/6/(i+3)*j; c.asterisk(i+3, outer_radius, inner_radius, rotate); c.stroke(); c.restore(); } } }
<svg baseProfile="full" height="200" version="1.1" width="200" xmlns="http://www.w3.org/2000/svg" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <g fill="none" stroke="#00ffff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 4.592425233973236e-16,-7.5 L 9.184850467946473e-16,-15"/> <path d=" M 6.495190620422363,3.75 L 12.990381240844727,7.5"/> <path d=" M -6.495190620422363,3.75 L -12.990381240844727,7.5"/> </g> <g fill="none" stroke="#00ffd4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 1.1576545238494873,26.767948150634766 L 2.3153090476989746,20.20256233215332"/> <path d=" M 5.106963157653809,37.61858367919922 L 10.213926315307617,41.903831481933594"/> <path d=" M -6.264617443084717,35.61346435546875 L -12.529234886169434,37.89360046386719"/> </g> <g fill="none" stroke="#00ffaa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 2.1376259326934814,60.79358673095703 L 4.275251865386963,54.92050552368164"/> <path d=" M 4.017422676086426,71.4544448852539 L 8.034845352172852,76.24221801757812"/> <path d=" M -6.155048370361328,67.75196838378906 L -12.310096740722656,68.83726501464844"/> </g> <g fill="none" stroke="#00ff7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 3,94.80384826660156 L 6,89.60769653320312"/> <path d=" M 3,105.19615173339844 L 6,110.39230346679688"/> <path d=" M -6,100 L -12,100"/> </g> <g fill="none" stroke="#00ff55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 3.7495944499969482,128.86473083496094 L 7.4991888999938965,124.3961410522461"/> <path d=" M 1.9951175451278687,138.8148651123047 L 3.9902350902557373,144.29640197753906"/> <path d=" M -5.744711875915527,132.32037353515625 L -11.489423751831055,131.30743408203125"/> </g> <g fill="none" stroke="#00ff2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 4.377396583557129,162.9936065673828 L 8.754793167114258,159.32052612304688"/> <path d=" M 0.9922752976417542,172.2941436767578 L 1.9845505952835083,177.92161560058594"/> <path d=" M -5.3696722984313965,164.71226501464844 L -10.739344596862793,162.75787353515625"/> </g> <g fill="none" stroke="#00d4ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 33.33333206176758,-3.75 L 33.33333206176758,-15"/> <path d=" M 37.08333206176758,0 L 48.33333206176758,0"/> <path d=" M 33.33333206176758,3.75 L 33.33333206176758,15"/> <path d=" M 29.583332061767578,4.592425233973236e-16 L 18.333332061767578,1.8369700935892946e-15"/> </g> <g fill="none" stroke="#00d4d4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 33.7684211730957,30.028514862060547 L 35.07368087768555,20.11406707763672"/> <path d=" M 36.63814926147461,33.7684211730957 L 46.55259704589844,35.07368087768555"/> <path d=" M 32.89824295043945,36.63814926147461 L 31.59298324584961,46.55259704589844"/> <path d=" M 30.028514862060547,32.89824295043945 L 20.11406707763672,31.59298324584961"/> </g> <g fill="none" stroke="#00d4aa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 34.14214324951172,63.64814758300781 L 36.56856918334961,54.59259033203125"/> <path d=" M 36.35184860229492,67.47547149658203 L 45.407405853271484,69.90190124511719"/> <path d=" M 32.52452087402344,69.6851806640625 L 30.098094940185547,78.74073791503906"/> <path d=" M 30.3148136138916,65.85785675048828 L 21.259258270263672,63.431427001953125"/> </g> <g fill="none" stroke="#00d47f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 34.48138427734375,97.22836303710938 L 37.925533294677734,88.91344451904297"/> <path d=" M 36.1049690246582,101.1480484008789 L 44.41988754272461,104.59220123291016"/> <path d=" M 32.185279846191406,102.77163696289062 L 28.741130828857422,111.08655548095703"/> <path d=" M 30.56169319152832,98.8519515991211 L 22.246776580810547,95.40779876708984"/> </g> <g fill="none" stroke="#00d455" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 34.791664123535156,130.8074188232422 L 39.166664123535156,123.22969818115234"/> <path d=" M 35.85923767089844,134.79165649414062 L 43.43696212768555,139.16665649414062"/> <path d=" M 31.874998092651367,135.85923767089844 L 27.499998092651367,143.43695068359375"/> <path d=" M 30.807424545288086,131.875 L 23.22970199584961,127.49999237060547"/> </g> <g fill="none" stroke="#00d42a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 35.07265090942383,164.3999481201172 L 40.29060363769531,157.5997772216797"/> <path d=" M 35.60005569458008,168.40599060058594 L 42.40022659301758,173.6239471435547"/> <path d=" M 31.594013214111328,168.9333953857422 L 26.37605857849121,175.7335662841797"/> <path d=" M 31.066608428955078,164.92735290527344 L 24.266437530517578,159.7093963623047"/> </g> <g fill="none" stroke="#00aaff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 66.66666412353516,-2.5 L 66.66666412353516,-15"/> <path d=" M 69.04430389404297,-0.7725424766540527 L 80.93251037597656,-4.635254859924316"/> <path d=" M 68.13612365722656,2.0225424766540527 L 75.48344421386719,12.135254859924316"/> <path d=" M 65.19720458984375,2.0225424766540527 L 57.849884033203125,12.135254859924316"/> <path d=" M 64.28902435302734,-0.7725424766540527 L 52.40081787109375,-4.635254859924316"/> </g> <g fill="none" stroke="#00aad4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 66.8989486694336,31.12328338623047 L 68.06037902832031,20.073040008544922"/> <path d=" M 68.84032440185547,32.871307373046875 L 79.70863342285156,30.561176300048828"/> <path d=" M 67.77777862548828,35.25783157348633 L 73.33332824707031,44.88033676147461"/> <path d=" M 65.1797103881836,34.984764099121094 L 57.74492263793945,43.24192810058594"/> <path d=" M 64.63656616210938,32.429473876953125 L 54.48605728149414,27.91017723083496"/> </g> <g fill="none" stroke="#00aaaa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 67.09981536865234,64.62886047363281 L 69.26556396484375,54.4398193359375"/> <path d=" M 68.73858642578125,66.44889831542969 L 79.09819030761719,65.36006164550781"/> <path d=" M 67.51403045654297,68.56988525390625 L 71.75086975097656,78.08598327636719"/> <path d=" M 65.11844635009766,68.06068420410156 L 57.37735366821289,75.03079986572266"/> <path d=" M 64.86244201660156,65.625 L 55.841346740722656,60.416664123535156"/> </g> <g fill="none" stroke="#00aa7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 67.28469848632812,98.09788513183594 L 70.37487030029297,88.58732604980469"/> <path d=" M 68.66666412353516,100 L 78.66666412353516,100"/> <path d=" M 67.28469848632812,101.90211486816406 L 70.37487030029297,111.41267395019531"/> <path d=" M 65.04862976074219,101.17556762695312 L 56.958457946777344,107.05342102050781"/> <path d=" M 65.04862976074219,98.82443237304688 L 56.958457946777344,92.94657897949219"/> </g> <g fill="none" stroke="#00aa55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 67.4575424194336,131.55699157714844 L 71.41192626953125,122.67530059814453"/> <path d=" M 68.60045623779297,133.5365753173828 L 78.26941680908203,134.55282592773438"/> <path d=" M 67.07093811035156,135.2352752685547 L 69.09230041503906,144.74505615234375"/> <path d=" M 64.98272705078125,134.30555725097656 L 56.56303405761719,139.16665649414062"/> <path d=" M 65.2216567993164,132.03224182128906 L 57.99664306640625,125.52680206298828"/> </g> <g fill="none" stroke="#00aa2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 67.6190414428711,165.01710510253906 L 72.38095092773438,156.7692413330078"/> <path d=" M 68.52980041503906,167.0626983642578 L 77.84549713134766,169.0428009033203"/> <path d=" M 66.86576843261719,168.56100463867188 L 67.86127471923828,178.0326385498047"/> <path d=" M 64.92657470703125,167.44140625 L 56.22614288330078,171.31509399414062"/> <path d=" M 65.39212799072266,165.25115966796875 L 59.01945877075195,158.173583984375"/> </g> <g fill="none" stroke="#007fff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 100,-1.875 L 100,-15"/> <path d=" M 101.62379455566406,-0.9375 L 112.9903793334961,-7.5"/> <path d=" M 101.62379455566406,0.9375 L 112.9903793334961,7.5"/> <path d=" M 100,1.875 L 100,15"/> <path d=" M 98.37620544433594,0.9375 L 87.0096206665039,7.5"/> <path d=" M 98.37620544433594,-0.9375 L 87.0096206665039,-7.5"/> </g> <g fill="none" stroke="#007fd4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 100.14525604248047,31.67300796508789 L 101.16207885742188,20.050735473632812"/> <path d=" M 101.51051330566406,32.62896728515625 L 112.0841064453125,27.698421478271484"/> <path d=" M 101.36524963378906,34.28929138183594 L 110.92202758789062,40.98101806640625"/> <path d=" M 99.85474395751953,34.993656158447266 L 98.83792114257812,46.615928649902344"/> <path d=" M 98.48948669433594,34.037696838378906 L 87.9158935546875,38.96824264526367"/> <path d=" M 98.63475036621094,32.37737274169922 L 89.07797241210938,25.685646057128906"/> </g> <g fill="none" stroke="#007faa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 100.27132415771484,65.12789916992188 L 102.17060089111328,54.3565673828125"/> <path d=" M 101.46826934814453,66.13225555419922 L 111.74615478515625,62.39141082763672"/> <path d=" M 101.19694519042969,67.6710205078125 L 109.57555389404297,74.70150756835938"/> <path d=" M 99.72867584228516,68.20542907714844 L 97.82939910888672,78.97676086425781"/> <path d=" M 98.53173065185547,67.2010726928711 L 88.25384521484375,70.9419174194336"/> <path d=" M 98.80305480957031,65.66230773925781 L 90.42444610595703,58.63182067871094"/> </g> <g fill="none" stroke="#007f7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 100.38822937011719,98.55110931396484 L 103.10582733154297,88.40888977050781"/> <path d=" M 101.44889068603516,99.61177062988281 L 111.59111022949219,96.89417266845703"/> <path d=" M 101.06066131591797,101.06066131591797 L 108.48528289794922,108.48528289794922"/> <path d=" M 99.61177062988281,101.44889068603516 L 96.89417266845703,111.59111022949219"/> <path d=" M 98.55110931396484,100.38822937011719 L 88.40888977050781,103.10582733154297"/> <path d=" M 98.93933868408203,98.93933868408203 L 91.51471710205078,91.51471710205078"/> </g> <g fill="none" stroke="#007f55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 100.498779296875,131.9629364013672 L 103.990234375,122.37024688720703"/> <path d=" M 101.4361801147461,133.08009338378906 L 111.48942565917969,131.30743408203125"/> <path d=" M 100.9374008178711,134.45046997070312 L 107.49919128417969,142.2705078125"/> <path d=" M 99.501220703125,134.70372009277344 L 96.009765625,144.29640197753906"/> <path d=" M 98.5638198852539,133.58656311035156 L 88.51057434082031,135.35922241210938"/> <path d=" M 99.0625991821289,132.2161865234375 L 92.50080871582031,124.3961410522461"/> </g> <g fill="none" stroke="#007f2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 100.6037368774414,165.3719482421875 L 104.82992553710938,156.30886840820312"/> <path d=" M 101.42313385009766,166.5421600341797 L 111.38508605957031,165.6706085205078"/> <path d=" M 100.81939697265625,167.83688354492188 L 106.55516052246094,176.02841186523438"/> <path d=" M 99.3962631225586,167.96139526367188 L 95.17007446289062,177.02447509765625"/> <path d=" M 98.57686614990234,166.7911834716797 L 88.61491394042969,167.66273498535156"/> <path d=" M 99.18060302734375,165.4964599609375 L 93.44483947753906,157.304931640625"/> </g> <g fill="none" stroke="#0055ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 133.3333282470703,-1.5 L 133.3333282470703,-15"/> <path d=" M 134.50607299804688,-0.9352347254753113 L 145.06080627441406,-9.352347373962402"/> <path d=" M 134.79571533203125,0.3337813913822174 L 147.95724487304688,3.3378140926361084"/> <path d=" M 133.98416137695312,1.3514533042907715 L 139.84158325195312,13.514533042907715"/> <path d=" M 132.6824951171875,1.3514533042907715 L 126.8250732421875,13.514533042907715"/> <path d=" M 131.87094116210938,0.3337813913822174 L 118.70941162109375,3.3378140926361084"/> <path d=" M 132.16058349609375,-0.9352347254753113 L 121.6058578491211,-9.352347373962402"/> </g> <g fill="none" stroke="#0055d4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 133.43296813964844,32.003726959228516 L 134.32972717285156,20.037281036376953"/> <path d=" M 134.4349822998047,32.582237243652344 L 144.34983825683594,25.822399139404297"/> <path d=" M 134.607421875,33.72633743286133 L 146.0742950439453,37.26340103149414"/> <path d=" M 133.82044982910156,34.57449722290039 L 138.2045440673828,45.74497985839844"/> <path d=" M 132.66665649414062,34.488033294677734 L 126.66666412353516,44.88033676147461"/> <path d=" M 132.014892578125,33.53205490112305 L 120.14891815185547,35.320560455322266"/> <path d=" M 132.35592651367188,32.42643356323242 L 123.5593032836914,24.264362335205078"/> </g> <g fill="none" stroke="#0055aa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 133.51963806152344,65.43062591552734 L 135.19635009765625,54.306278228759766"/> <path d=" M 134.41586303710938,66.04166412353516 L 144.1586456298828,60.416664123535156"/> <path d=" M 134.49691772460938,67.12333679199219 L 144.96925354003906,71.23342895507812"/> <path d=" M 133.70176696777344,67.86112976074219 L 137.01776123046875,78.611328125"/> <path d=" M 132.62918090820312,67.699462890625 L 126.29182434082031,76.9946517944336"/> <path d=" M 132.08682250976562,66.76007843017578 L 120.86827850341797,67.60079193115234"/> <path d=" M 132.4831085205078,65.75035095214844 L 124.83116912841797,57.503517150878906"/> </g> <g fill="none" stroke="#00557f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 133.60035705566406,98.83008575439453 L 136.0035858154297,88.30086517333984"/> <path d=" M 134.41448974609375,99.47933959960938 L 144.14495849609375,94.79339599609375"/> <path d=" M 134.41448974609375,100.52066040039062 L 144.14495849609375,105.20660400390625"/> <path d=" M 133.60035705566406,101.16991424560547 L 136.0035858154297,111.69913482666016"/> <path d=" M 132.58514404296875,100.93819427490234 L 125.85144805908203,109.3819808959961"/> <path d=" M 132.13333129882812,100 L 121.33332824707031,100"/> <path d=" M 132.58514404296875,99.06180572509766 L 125.85144805908203,90.6180191040039"/> </g> <g fill="none" stroke="#005555" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 133.67721557617188,132.21849060058594 L 136.7721405029297,122.18498229980469"/> <path d=" M 134.41934204101562,132.9071044921875 L 144.1935272216797,129.07101440429688"/> <path d=" M 134.34368896484375,133.91665649414062 L 143.43695068359375,139.16665649414062"/> <path d=" M 133.50721740722656,134.48696899414062 L 135.07215881347656,144.86968994140625"/> <path d=" M 132.539794921875,134.1885528564453 L 125.39797973632812,141.88560485839844"/> <path d=" M 132.169921875,133.2461395263672 L 121.69927978515625,132.4614715576172"/> <path d=" M 132.67611694335938,132.369384765625 L 126.76126098632812,123.69387817382812"/> </g> <g fill="none" stroke="#00552a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 133.7508544921875,165.60281372070312 L 137.50865173339844,156.02810668945312"/> <path d=" M 134.4254150390625,166.32980346679688 L 144.25416564941406,163.29803466796875"/> <path d=" M 134.27760314941406,167.3104705810547 L 142.77606201171875,173.1046142578125"/> <path d=" M 133.41873168945312,167.80633544921875 L 134.18739318847656,178.06329345703125"/> <path d=" M 132.4955596923828,167.4440155029297 L 124.9555892944336,174.44007873535156"/> <path d=" M 132.20323181152344,166.496337890625 L 122.03240203857422,164.9633331298828"/> <path d=" M 132.76190185546875,165.6769256591797 L 127.6190414428711,156.7692413330078"/> </g> <g fill="none" stroke="#002aff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 166.6666717529297,-1.25 L 166.6666717529297,-15"/> <path d=" M 167.55055236816406,-0.8838834762573242 L 177.2732696533203,-10.60660171508789"/> <path d=" M 167.9166717529297,0 L 181.6666717529297,0"/> <path d=" M 167.55055236816406,0.8838834762573242 L 177.2732696533203,10.60660171508789"/> <path d=" M 166.6666717529297,1.25 L 166.6666717529297,15"/> <path d=" M 165.7827911376953,0.8838834762573242 L 156.06007385253906,10.60660171508789"/> <path d=" M 165.4166717529297,1.5308084995570108e-16 L 151.6666717529297,1.8369700935892946e-15"/> <path d=" M 165.7827911376953,-0.8838834762573242 L 156.06007385253906,-10.60660171508789"/> </g> <g fill="none" stroke="#002ad4" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 166.73934936523438,32.22460174560547 L 167.53871154785156,20.028545379638672"/> <path d=" M 167.50204467773438,32.60072708129883 L 176.6912078857422,24.54205322265625"/> <path d=" M 167.77540588378906,33.406002044677734 L 179.97145080566406,34.20537567138672"/> <path d=" M 167.39927673339844,34.16870880126953 L 175.45794677734375,43.35786437988281"/> <path d=" M 166.593994140625,34.44206237792969 L 165.7946319580078,46.638118743896484"/> <path d=" M 165.831298828125,34.06593704223633 L 156.6421356201172,42.124610900878906"/> <path d=" M 165.5579376220703,33.26066207885742 L 153.3618927001953,32.46128845214844"/> <path d=" M 165.93406677246094,32.497955322265625 L 157.87539672851562,23.308801651000977"/> </g> <g fill="none" stroke="#002aaa" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 166.80264282226562,65.6339111328125 L 168.29824829101562,54.27360534667969"/> <path d=" M 167.4930877685547,66.03253936767578 L 176.58358764648438,59.05714416503906"/> <path d=" M 167.69943237304688,66.80262756347656 L 179.0597381591797,68.2982406616211"/> <path d=" M 167.30079650878906,67.49307250976562 L 174.27618408203125,76.58358001708984"/> <path d=" M 166.53070068359375,67.69941711425781 L 165.03509521484375,79.05972290039062"/> <path d=" M 165.8402557373047,67.30078887939453 L 156.749755859375,74.27618408203125"/> <path d=" M 165.6339111328125,66.53070068359375 L 154.2736053466797,65.03508758544922"/> <path d=" M 166.0325469970703,65.84025573730469 L 159.05715942382812,56.74974822998047"/> </g> <g fill="none" stroke="#002a7f" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 166.86175537109375,99.01921844482422 L 169.00775146484375,88.23057556152344"/> <path d=" M 167.49813842773438,99.44442749023438 L 176.64430236816406,93.33316040039062"/> <path d=" M 167.6474609375,100.1950912475586 L 178.43609619140625,102.3410873413086"/> <path d=" M 167.2222442626953,100.83146667480469 L 173.33351135253906,109.9776382446289"/> <path d=" M 166.47158813476562,100.98078155517578 L 164.32559204101562,111.76942443847656"/> <path d=" M 165.835205078125,100.55557250976562 L 156.6890411376953,106.66683959960938"/> <path d=" M 165.68588256835938,99.8049087524414 L 154.89724731445312,97.6589126586914"/> <path d=" M 166.11109924316406,99.16853332519531 L 159.9998321533203,90.0223617553711"/> </g> <g fill="none" stroke="#002a55" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 166.91830444335938,132.39422607421875 L 169.6862335205078,122.06419372558594"/> <path d=" M 167.50863647460938,132.8472137451172 L 176.77029418945312,127.49999237060547"/> <path d=" M 167.60577392578125,133.5849609375 L 177.93580627441406,136.35289001464844"/> <path d=" M 167.1527862548828,134.17529296875 L 172.5,143.43695068359375"/> <path d=" M 166.4150390625,134.27243041992188 L 163.64710998535156,144.6024627685547"/> <path d=" M 165.82470703125,133.81944274902344 L 156.56304931640625,139.16665649414062"/> <path d=" M 165.72756958007812,133.08169555664062 L 155.3975372314453,130.3137664794922"/> <path d=" M 166.18055725097656,132.49136352539062 L 160.83334350585938,123.22969818115234"/> </g> <g fill="none" stroke="#002a2a" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="translate(16.666666666666668,16.666666666666668)"> <path d=" M 166.97280883789062,165.76483154296875 L 170.34027099609375,155.84461975097656"/> <path d=" M 167.52084350585938,166.2454376220703 L 176.91664123535156,161.6119384765625"/> <path d=" M 167.56851196289062,166.97280883789062 L 177.4887237548828,170.34027099609375"/> <path d=" M 167.08790588378906,167.52084350585938 L 171.72140502929688,176.91664123535156"/> <path d=" M 166.36053466796875,167.56851196289062 L 162.99307250976562,177.4887237548828"/> <path d=" M 165.8125,167.08790588378906 L 156.4167022705078,171.72140502929688"/> <path d=" M 165.76483154296875,166.36053466796875 L 155.84461975097656,162.99307250976562"/> <path d=" M 166.2454376220703,165.8125 L 161.6119384765625,156.4167022705078"/> </g> </svg>
3: svg_shapes
function(c) { c.scale(.5,.5); c.beginPath(); c.moveTo(125,75) c.ellipticalArc(100,50, 0, 0,0, 100,50); c.stroke(); c.strokeStyle='blue' c.beginPath(); c.moveTo(125,75) c.ellipticalArc(100,50, 0, 1,0, 100,50); c.stroke(); c.strokeStyle='green' c.beginPath(); c.moveTo(125,75) c.ellipticalArc(100,50, 0, 0,1, 100,50); c.stroke(); c.strokeStyle='red' c.beginPath(); c.moveTo(125,75) c.ellipticalArc(100,50, 0, 1,1, 100,50); c.stroke(); c.translate(-25,50); c.strokeStyle='black' c.fillStyle='rgba(100,100,100,.3)' c.beginPath(); c.moveTo(50,50) c.smoothCurveTo(150,50) c.smoothCurveTo(150,150) c.smoothCurveTo(50,150) c.smoothCurveTo(50,50) c.draw(); c.translate(100,20); c.strokeStyle='black' c.fillStyle='rgba(255,0,0,.3)' c.strokePath("M50,50 T150,50 T150,150 T50,150 T50,50"); c.fillPath("M50,50 T150,50 T150,150 T50,150 T50,50"); c.translate(20,0); c.drawPath("M50,50 T150,50 T150,150 T50,150 T50,50"); c.translate(100,-20); c.fillStyle='rgba(0,255,0,.3)' c.strokeRoundedRect(10,10,100,100,10,10); c.fillRoundedRect(10,10,100,100,10,10); c.translate(20,20); c.drawRoundedRect(10,10,100,100,10,10); c.translate(70,25); c.fillStyle='rgba(0,0,255,.3)' c.strokeCircle(50, 50, 40); c.fillCircle(50, 50, 40); c.translate(20,0); c.drawCircle(50, 50, 40); c.translate(-240,100); c.fillStyle='rgba(150,0,150,.3)' c.strokeEllipse(50, 50, 100, 40); c.fillEllipse(50, 50, 100, 40); c.translate(20,20); c.drawEllipse(50, 50, 100, 40); c.translate(130,-20); c.fillStyle='rgba(150,150,0,.3)' c.strokePolyline("50,50 150,50 150,150 50,150"); c.fillPolyline("50,50 150,50 150,150 50,150"); c.translate(20,20); c.drawPolyline("50,50 150,50 150,150 50,150"); c.translate(-130,20); c.fillStyle='rgba(0,150,150,.3)' c.strokePolygon("50,50 150,50 150,150 50,150"); c.fillPolygon("50,50 150,50 150,150 50,150"); c.translate(20,20); c.drawPolygon("50,50 150,50 150,150 50,150"); }
<svg baseProfile="full" height="200" version="1.1" width="200" xmlns="http://www.w3.org/2000/svg" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <path d=" M 125,75 A 100,50 0 0,0 100,50" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5)"/> <path d=" M 125,75 A 100,50 0 1,0 100,50" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5)"/> <path d=" M 125,75 A 100,50 0 0,1 100,50" fill="none" stroke="#008000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5)"/> <path d=" M 125,75 A 100,50 0 1,1 100,50" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5)"/> <path d=" M 25,100 T 125,100 T 125,200 T 25,200 T 25,100" fill="#646464" fill-opacity="0.3" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5)"/> <path d="M50,50 T150,50 T150,150 T50,150 T50,50" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,75,70)"/> <path d="M50,50 T150,50 T150,150 T50,150 T50,50" fill="#ff0000" fill-opacity="0.3" stroke="none" transform="scale(0.5,0.5) matrix(1,0,0,1,75,70)"/> <path d="M50,50 T150,50 T150,150 T50,150 T50,50" fill="#ff0000" fill-opacity="0.3" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,95,70)"/> <rect fill="none" height="100" rx="10" ry="10" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,195,50)" width="100" x="10" y="10"/> <rect fill="#00ff00" fill-opacity="0.3" height="100" rx="10" ry="10" stroke="none" transform="scale(0.5,0.5) matrix(1,0,0,1,195,50)" width="100" x="10" y="10"/> <rect fill="#00ff00" fill-opacity="0.3" height="100" rx="10" ry="10" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,215,70)" width="100" x="10" y="10"/> <circle cx="50" cy="50" fill="none" r="40" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,285,95)"/> <circle cx="50" cy="50" fill="#0000ff" fill-opacity="0.3" r="40" stroke="none" transform="scale(0.5,0.5) matrix(1,0,0,1,285,95)"/> <circle cx="50" cy="50" fill="#0000ff" fill-opacity="0.3" r="40" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,305,95)"/> <ellipse cx="50" cy="50" fill="none" rx="100" ry="40" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,65,195)"/> <ellipse cx="50" cy="50" fill="#960096" fill-opacity="0.3" rx="100" ry="40" stroke="none" transform="scale(0.5,0.5) matrix(1,0,0,1,65,195)"/> <ellipse cx="50" cy="50" fill="#960096" fill-opacity="0.3" rx="100" ry="40" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,85,215)"/> <polyline fill="none" points="50,50 150,50 150,150 50,150" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,215,195)"/> <polyline fill="#969600" fill-opacity="0.3" points="50,50 150,50 150,150 50,150" stroke="none" transform="scale(0.5,0.5) matrix(1,0,0,1,215,195)"/> <polyline fill="#969600" fill-opacity="0.3" points="50,50 150,50 150,150 50,150" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,235,215)"/> <polygon fill="none" points="50,50 150,50 150,150 50,150" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,105,235)"/> <polygon fill="#009696" fill-opacity="0.3" points="50,50 150,50 150,150 50,150" stroke="none" transform="scale(0.5,0.5) matrix(1,0,0,1,105,235)"/> <polygon fill="#009696" fill-opacity="0.3" points="50,50 150,50 150,150 50,150" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="scale(0.5,0.5) matrix(1,0,0,1,125,255)"/> </svg>
4: markers
function(c) { var markers = [ c.pollygon(5, 10) ]; var n = markers.length; for (var i=0; i<n; i++) { c.startMarker(); c.pollygon(5, 10); c.stroke(); var marker = c.endMarker(); c.markerStart = marker; c.markerMid = marker; c.markerEnd = marker; c.moveTo(10,10); c.lineTo(100,100); c.lineTo(200-10,200-10); c.stroke(); } }
<svg baseProfile="full" height="200" version="1.1" width="200" xmlns="http://www.w3.org/2000/svg" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <marker id="marker0" orient="auto" style="overflow:visible;"> <g> <path d=" M 3.9710712453228396e-16,-6.485251426696777 L 6.167840957641602,-2.0040528774261475 L 3.8119351863861084,5.246678829193115 L -3.8119351863861084,5.246678829193115 L -6.167840957641602,-2.0040528774261475 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> </defs> <path d=" M 10,10 L 100,100 L 190,190" fill="none" marker-end="url(#marker0)" marker-mid="url(#marker0)" marker-start="url(#marker0)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </svg>
5: inkscape_markers
function(c) { var markers = [c.inkscapeArrow1, c.inkscapeArrow1Lstart, c.inkscapeArrow1Lend, c.inkscapeArrow1Mstart, c.inkscapeArrow1Mend, c.inkscapeArrow1Sstart, c.inkscapeArrow1Send, c.inkscapeArrow2, c.inkscapeArrow2Lstart, c.inkscapeArrow2Lend, c.inkscapeArrow2Mstart, c.inkscapeArrow2Mend, c.inkscapeArrow2Sstart, c.inkscapeArrow2Send, c.inkscapeTail, c.inkscapeDistance, c.inkscapeDistanceIn, c.inkscapeDistanceOut, c.inkscapeDot, c.inkscapeDot_l, c.inkscapeDot_m, c.inkscapeDot_s, c.inkscapeSquare, c.inkscapeSquareL, c.inkscapeSquareS, c.inkscapeDiamond, c.inkscapeDiamondM, c.inkscapeDiamondS, c.inkscapeTriangle, c.inkscapeTriangleInL, c.inkscapeTriangleInM, c.inkscapeTriangleInS, c.inkscapeTriangleOutL, c.inkscapeTriangleOutM, c.inkscapeTriangleOutS, c.inkscapeStop, c.inkscapeStopL, c.inkscapeStopS, c.inkscapeSemiCircleIn, c.inkscapeSemiCircleOut, c.inkscapeSemiCurveIn, c.inkscapeSemiCurveOut, c.inkscapeSemiScissors, c.inkscapeSemiClub] var n = markers.length; var across = Math.ceil(Math.sqrt(n)); for (var j=0; j<across; j++) { for (var i=0; i<across && j*across+i<n; i++) { c.startMarker(); markers[j*across+i].call(c); var marker = c.endMarker(); c.markerStart = marker; c.markerMid = marker; c.markerEnd = marker; c.moveTo((i+.2)*200/across,(j+.2)*200/across); c.lineTo((i+.3)*200/across,(j+.5)*200/across); c.lineTo((i+.4)*200/across,(j+.8)*200/across); c.stroke(); } } }
<svg baseProfile="full" height="200" version="1.1" width="200" xmlns="http://www.w3.org/2000/svg" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <marker id="marker1" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,0 L 5,-5 L -12.5,0 L 5,5 L 0,0 Z" fill="#000000" stroke="none"/> <path d=" M 0,0 L 5,-5 L -12.5,0 L 5,5 L 0,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker2" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,0 L 4,-4 L -10,0 L 4,4 L 0,0 Z" fill="#000000" stroke="none"/> <path d=" M 0,0 L 4,-4 L -10,0 L 4,4 L 0,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker3" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,0 L -4,4 L 10,-1.2246467996456087e-15 L -4,-4 L 0,0 Z" fill="#000000" stroke="none"/> <path d=" M 0,0 L -4,4 L 10,-1.2246467996456087e-15 L -4,-4 L 0,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker4" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,0 L 2,-2 L -5,0 L 2,2 L 0,0 Z" fill="#000000" stroke="none"/> <path d=" M 0,0 L 2,-2 L -5,0 L 2,2 L 0,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker5" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,0 L -2,2 L 5,-6.123233998228043e-16 L -2,-2 L 0,0 Z" fill="#000000" stroke="none"/> <path d=" M 0,0 L -2,2 L 5,-6.123233998228043e-16 L -2,-2 L 0,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker6" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,0 L 1,-1 L -2.5,0 L 1,1 L 0,0 Z" fill="#000000" stroke="none"/> <path d=" M 0,0 L 1,-1 L -2.5,0 L 1,1 L 0,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker7" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,0 L -1,1 L 2.5,-3.0616169991140216e-16 L -1,-1 L 0,0 Z" fill="#000000" stroke="none"/> <path d=" M 0,0 L -1,1 L 2.5,-3.0616169991140216e-16 L -1,-1 L 0,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker8" orient="auto" style="overflow:visible;"> <g> <path d=" M 3.718587875366211,4.033735275268555 L -7.207289695739746,0.01601325534284115 L 3.7185888290405273,-4.001708030700684 C 1.9730901718139648,-1.629646897315979 1.9831476211547852,1.6157441139221191 3.718587875366211,4.033735275268555 Z" fill="#000000" stroke="none"/> <path d=" M 3.718587875366211,4.033735275268555 L -7.207289695739746,0.01601325534284115 L 3.7185888290405273,-4.001708030700684 C 1.9730901718139648,-1.629646897315979 1.9831476211547852,1.6157441139221191 3.718587875366211,4.033735275268555 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.625"/> </g> </marker> <marker id="marker9" orient="auto" style="overflow:visible;"> <g> <path d=" M 4.090446949005127,4.437108993530273 L -7.928018569946289,0.01761458069086075 L 4.090447902679443,-4.401878833770752 C 2.1703991889953613,-1.7926115989685059 2.181462526321411,1.7773185968399048 4.090446949005127,4.437108993530273 Z" fill="#000000" stroke="none"/> <path d=" M 4.090446949005127,4.437108993530273 L -7.928018569946289,0.01761458069086075 L 4.090447902679443,-4.401878833770752 C 2.1703991889953613,-1.7926115989685059 2.181462526321411,1.7773185968399048 4.090446949005127,4.437108993530273 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.625"/> </g> </marker> <marker id="marker10" orient="auto" style="overflow:visible;"> <g> <path d=" M -4.090446949005127,-4.437108993530273 L 7.928018569946289,-0.01761458069086075 L -4.090447902679443,4.401878833770752 C -2.1703991889953613,1.7926115989685059 -2.181462526321411,-1.7773185968399048 -4.090446949005127,-4.437108993530273 Z" fill="#000000" stroke="none"/> <path d=" M -4.090446949005127,-4.437108993530273 L 7.928018569946289,-0.01761458069086075 L -4.090447902679443,4.401878833770752 C -2.1703991889953613,1.7926115989685059 -2.181462526321411,-1.7773185968399048 -4.090446949005127,-4.437108993530273 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.625"/> </g> </marker> <marker id="marker11" orient="auto" style="overflow:visible;"> <g> <path d=" M 2.2311527729034424,2.420241355895996 L -4.324373722076416,0.009607953950762749 L 2.2311534881591797,-2.40102481842041 C 1.183854103088379,-0.9777881503105164 1.189888596534729,0.9694464802742004 2.2311527729034424,2.420241355895996 Z" fill="#000000" stroke="none"/> <path d=" M 2.2311527729034424,2.420241355895996 L -4.324373722076416,0.009607953950762749 L 2.2311534881591797,-2.40102481842041 C 1.183854103088379,-0.9777881503105164 1.189888596534729,0.9694464802742004 2.2311527729034424,2.420241355895996 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.625"/> </g> </marker> <marker id="marker12" orient="auto" style="overflow:visible;"> <g> <path d=" M -2.2311527729034424,-2.420241355895996 L 4.324373722076416,-0.009607953950762749 L -2.2311534881591797,2.40102481842041 C -1.183854103088379,0.9777881503105164 -1.189888596534729,-0.9694464802742004 -2.2311527729034424,-2.420241355895996 Z" fill="#000000" stroke="none"/> <path d=" M -2.2311527729034424,-2.420241355895996 L 4.324373722076416,-0.009607953950762749 L -2.2311534881591797,2.40102481842041 C -1.183854103088379,0.9777881503105164 -1.189888596534729,-0.9694464802742004 -2.2311527729034424,-2.420241355895996 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.625"/> </g> </marker> <marker id="marker13" orient="auto" style="overflow:visible;"> <g> <path d=" M 1.1155763864517212,1.210120677947998 L -2.162186861038208,0.004803976975381374 L 1.1155767440795898,-1.200512409210205 C 0.5919270515441895,-0.4888940751552582 0.5949442982673645,0.4847232401371002 1.1155763864517212,1.210120677947998 Z" fill="#000000" stroke="none"/> <path d=" M 1.1155763864517212,1.210120677947998 L -2.162186861038208,0.004803976975381374 L 1.1155767440795898,-1.200512409210205 C 0.5919270515441895,-0.4888940751552582 0.5949442982673645,0.4847232401371002 1.1155763864517212,1.210120677947998 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.625"/> </g> </marker> <marker id="marker14" orient="auto" style="overflow:visible;"> <g> <path d=" M -1.1155763864517212,-1.210120677947998 L 2.162186861038208,-0.004803976975381374 L -1.1155767440795898,1.200512409210205 C -0.5919270515441895,0.4888940751552582 -0.5949442982673645,-0.4847232401371002 -1.1155763864517212,-1.210120677947998 Z" fill="#000000" stroke="none"/> <path d=" M -1.1155763864517212,-1.210120677947998 L 2.162186861038208,-0.004803976975381374 L -1.1155767440795898,1.200512409210205 C -0.5919270515441895,0.4888940751552582 -0.5949442982673645,-0.4847232401371002 -1.1155763864517212,-1.210120677947998 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.625"/> </g> </marker> <marker id="marker15" orient="auto" style="overflow:visible;"> <g> <path d=" M 4.565841197967529,4.750227451324463 L -0.652225136756897,0.0008173781097866595" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.8"/> <g fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.8"> <path d=" M 4.565841197967529,4.750227451324463 L -0.652225136756897,0.0008173781097866595"/> <path d=" M 1.5440199375152588,4.750227451324463 L -3.674046516418457,0.0008173781097866595"/> </g> <g fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.8"> <path d=" M 4.565841197967529,4.750227451324463 L -0.652225136756897,0.0008173781097866595"/> <path d=" M 1.5440199375152588,4.750227451324463 L -3.674046516418457,0.0008173781097866595"/> <path d=" M -1.566429853439331,4.750227451324463 L -6.784496307373047,0.0008173781097866595"/> </g> <g fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.8"> <path d=" M 4.565841197967529,4.750227451324463 L -0.652225136756897,0.0008173781097866595"/> <path d=" M 1.5440199375152588,4.750227451324463 L -3.674046516418457,0.0008173781097866595"/> <path d=" M -1.566429853439331,4.750227451324463 L -6.784496307373047,0.0008173781097866595"/> <path d=" M 4.565841197967529,-5.013100624084473 L -0.652225136756897,-0.263690710067749"/> </g> <g fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.8"> <path d=" M 4.565841197967529,4.750227451324463 L -0.652225136756897,0.0008173781097866595"/> <path d=" M 1.5440199375152588,4.750227451324463 L -3.674046516418457,0.0008173781097866595"/> <path d=" M -1.566429853439331,4.750227451324463 L -6.784496307373047,0.0008173781097866595"/> <path d=" M 4.565841197967529,-5.013100624084473 L -0.652225136756897,-0.263690710067749"/> <path d=" M 1.5440199375152588,-5.013100624084473 L -3.674046516418457,-0.263690710067749"/> </g> <g fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="round" stroke-width="0.8"> <path d=" M 4.565841197967529,4.750227451324463 L -0.652225136756897,0.0008173781097866595"/> <path d=" M 1.5440199375152588,4.750227451324463 L -3.674046516418457,0.0008173781097866595"/> <path d=" M -1.566429853439331,4.750227451324463 L -6.784496307373047,0.0008173781097866595"/> <path d=" M 4.565841197967529,-5.013100624084473 L -0.652225136756897,-0.263690710067749"/> <path d=" M 1.5440199375152588,-5.013100624084473 L -3.674046516418457,-0.263690710067749"/> <path d=" M -1.566429853439331,-5.013100624084473 L -6.784496307373047,-0.263690710067749"/> </g> </g> </marker> <marker id="marker16" orient="auto" style="overflow:visible;"> <g> <path d=" M 8,0 L 13,-5 L -4.5,0 L 13,5 L 8,0 Z" fill="#000000" stroke="none"/> <path d=" M 8,0 L 13,-5 L -4.5,0 L 13,5 L 8,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M -6.75994873046875,-7 L -6.75994873046875,65" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker17" orient="auto" style="overflow:visible;"> <g> <path d=" M 4.800000190734863,0 L 7.800000190734863,-3 L -2.700000047683716,0 L 7.800000190734863,3 L 4.800000190734863,0 Z" fill="#000000" stroke="none"/> <path d=" M 4.800000190734863,0 L 7.800000190734863,-3 L -2.700000047683716,0 L 7.800000190734863,3 L 4.800000190734863,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M -4.05596923828125,-4.200000286102295 L -4.05596923828125,39" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker18" orient="auto" style="overflow:visible;"> <g> <path d=" M -4.800000190734863,0 L -7.800000190734863,-3 L 2.700000047683716,0 L -7.800000190734863,3 L -4.800000190734863,0 Z" fill="#000000" stroke="none"/> <path d=" M -4.800000190734863,0 L -7.800000190734863,-3 L 2.700000047683716,0 L -7.800000190734863,3 L -4.800000190734863,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 4.05596923828125,-4.200000286102295 L 4.05596923828125,39" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker19" orient="auto" style="overflow:visible;"> <g> <path d=" M 4.625493049621582,0 C 4.625493049621582,2.759999990463257 2.385493278503418,5 -0.37450695037841797,5 C -3.134507179260254,5 -5.374506950378418,2.759999990463257 -5.374506950378418,0 C -5.374506950378418,-2.759999990463257 -3.134507179260254,-5 -0.37450695037841797,-5 C 2.385493278503418,-5 4.625493049621582,-2.759999990463257 4.625493049621582,0 Z" fill="#000000" stroke="none"/> <path d=" M 4.625493049621582,0 C 4.625493049621582,2.759999990463257 2.385493278503418,5 -0.37450695037841797,5 C -3.134507179260254,5 -5.374506950378418,2.759999990463257 -5.374506950378418,0 C -5.374506950378418,-2.759999990463257 -3.134507179260254,-5 -0.37450695037841797,-5 C 2.385493278503418,-5 4.625493049621582,-2.759999990463257 4.625493049621582,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker20" orient="auto" style="overflow:visible;"> <g> <path d=" M 3.70039439201355,0 C 3.70039439201355,2.2079999446868896 1.908394694328308,4 -0.2996055781841278,4 C -2.507605791091919,4 -4.299605846405029,2.2079999446868896 -4.299605846405029,0 C -4.299605846405029,-2.2079999446868896 -2.507605791091919,-4 -0.2996055781841278,-4 C 1.908394694328308,-4 3.70039439201355,-2.2079999446868896 3.70039439201355,0 Z" fill="#000000" stroke="none"/> <path d=" M 3.70039439201355,0 C 3.70039439201355,2.2079999446868896 1.908394694328308,4 -0.2996055781841278,4 C -2.507605791091919,4 -4.299605846405029,2.2079999446868896 -4.299605846405029,0 C -4.299605846405029,-2.2079999446868896 -2.507605791091919,-4 -0.2996055781841278,-4 C 1.908394694328308,-4 3.70039439201355,-2.2079999446868896 3.70039439201355,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker21" orient="auto" style="overflow:visible;"> <g> <path d=" M 1.850197196006775,0 C 1.850197196006775,1.1039999723434448 0.954197347164154,2 -0.1498027890920639,2 C -1.2538028955459595,2 -2.1498029232025146,1.1039999723434448 -2.1498029232025146,0 C -2.1498029232025146,-1.1039999723434448 -1.2538028955459595,-2 -0.1498027890920639,-2 C 0.954197347164154,-2 1.850197196006775,-1.1039999723434448 1.850197196006775,0 Z" fill="#000000" stroke="none"/> <path d=" M 1.850197196006775,0 C 1.850197196006775,1.1039999723434448 0.954197347164154,2 -0.1498027890920639,2 C -1.2538028955459595,2 -2.1498029232025146,1.1039999723434448 -2.1498029232025146,0 C -2.1498029232025146,-1.1039999723434448 -1.2538028955459595,-2 -0.1498027890920639,-2 C 0.954197347164154,-2 1.850197196006775,-1.1039999723434448 1.850197196006775,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker22" orient="auto" style="overflow:visible;"> <g> <path d=" M 0.9250985980033875,0 C 0.9250985980033875,0.5519999861717224 0.477098673582077,1 -0.07490139454603195,1 C -0.6269014477729797,1 -1.0749014616012573,0.5519999861717224 -1.0749014616012573,0 C -1.0749014616012573,-0.5519999861717224 -0.6269014477729797,-1 -0.07490139454603195,-1 C 0.477098673582077,-1 0.9250985980033875,-0.5519999861717224 0.9250985980033875,0 Z" fill="#000000" stroke="none"/> <path d=" M 0.9250985980033875,0 C 0.9250985980033875,0.5519999861717224 0.477098673582077,1 -0.07490139454603195,1 C -0.6269014477729797,1 -1.0749014616012573,0.5519999861717224 -1.0749014616012573,0 C -1.0749014616012573,-0.5519999861717224 -0.6269014477729797,-1 -0.07490139454603195,-1 C 0.477098673582077,-1 0.9250985980033875,-0.5519999861717224 0.9250985980033875,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker23" orient="auto" style="overflow:visible;"> <g> <path d=" M -5,-5 L -5,5 L 5,5 L 5,-5 L -5,-5 Z" fill="#000000" stroke="none"/> <path d=" M -5,-5 L -5,5 L 5,5 L 5,-5 L -5,-5 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker24" orient="auto" style="overflow:visible;"> <g> <path d=" M -4,-4 L -4,4 L 4,4 L 4,-4 L -4,-4 Z" fill="#000000" stroke="none"/> <path d=" M -4,-4 L -4,4 L 4,4 L 4,-4 L -4,-4 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker25" orient="auto" style="overflow:visible;"> <g> <path d=" M -1,-1 L -1,1 L 1,1 L 1,-1 L -1,-1 Z" fill="#000000" stroke="none"/> <path d=" M -1,-1 L -1,1 L 1,1 L 1,-1 L -1,-1 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker26" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,-7.0710768699646 L -7.071089267730713,0 L 0,7.071058750152588 L 7.071046352386475,0 L 0,-7.0710768699646 Z" fill="#000000" stroke="none"/> <path d=" M 0,-7.0710768699646 L -7.071089267730713,0 L 0,7.071058750152588 L 7.071046352386475,0 L 0,-7.0710768699646 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker27" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,-2.8284308910369873 L -2.8284356594085693,0 L 0,2.828423500061035 L 2.828418493270874,0 L 0,-2.8284308910369873 Z" fill="#000000" stroke="none"/> <path d=" M 0,-2.8284308910369873 L -2.8284356594085693,0 L 0,2.828423500061035 L 2.828418493270874,0 L 0,-2.8284308910369873 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker28" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,-1.4142154455184937 L -1.4142178297042847,0 L 0,1.4142117500305176 L 1.414209246635437,0 L 0,-1.4142154455184937 Z" fill="#000000" stroke="none"/> <path d=" M 0,-1.4142154455184937 L -1.4142178297042847,0 L 0,1.4142117500305176 L 1.414209246635437,0 L 0,-1.4142154455184937 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker29" orient="auto" style="overflow:visible;"> <g> <path d=" M 5.769999980926514,0 L -2.880000114440918,5 L -2.880000114440918,-5 L 5.769999980926514,0 Z" fill="#000000" stroke="none"/> <path d=" M 5.769999980926514,0 L -2.880000114440918,5 L -2.880000114440918,-5 L 5.769999980926514,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker30" orient="auto" style="overflow:visible;"> <g> <path d=" M -4.616000175476074,0 L 2.30400013923645,-4 L 2.30400013923645,4 L -4.616000175476074,0 Z" fill="#000000" stroke="none"/> <path d=" M -4.616000175476074,0 L 2.30400013923645,-4 L 2.30400013923645,4 L -4.616000175476074,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker31" orient="auto" style="overflow:visible;"> <g> <path d=" M -2.308000087738037,0 L 1.152000069618225,-2 L 1.152000069618225,2 L -2.308000087738037,0 Z" fill="#000000" stroke="none"/> <path d=" M -2.308000087738037,0 L 1.152000069618225,-2 L 1.152000069618225,2 L -2.308000087738037,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker32" orient="auto" style="overflow:visible;"> <g> <path d=" M -1.1540000438690186,0 L 0.5760000348091125,-1 L 0.5760000348091125,1 L -1.1540000438690186,0 Z" fill="#000000" stroke="none"/> <path d=" M -1.1540000438690186,0 L 0.5760000348091125,-1 L 0.5760000348091125,1 L -1.1540000438690186,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker33" orient="auto" style="overflow:visible;"> <g> <path d=" M 4.616000175476074,0 L -2.30400013923645,4 L -2.30400013923645,-4 L 4.616000175476074,0 Z" fill="#000000" stroke="none"/> <path d=" M 4.616000175476074,0 L -2.30400013923645,4 L -2.30400013923645,-4 L 4.616000175476074,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker34" orient="auto" style="overflow:visible;"> <g> <path d=" M 2.308000087738037,0 L -1.152000069618225,2 L -1.152000069618225,-2 L 2.308000087738037,0 Z" fill="#000000" stroke="none"/> <path d=" M 2.308000087738037,0 L -1.152000069618225,2 L -1.152000069618225,-2 L 2.308000087738037,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker35" orient="auto" style="overflow:visible;"> <g> <path d=" M 1.1540000438690186,0 L -0.5760000348091125,1 L -0.5760000348091125,-1 L 1.1540000438690186,0 Z" fill="#000000" stroke="none"/> <path d=" M 1.1540000438690186,0 L -0.5760000348091125,1 L -0.5760000348091125,-1 L 1.1540000438690186,0 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker36" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,5.650000095367432 L 0,-5.650000095367432" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker37" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,4.519999980926514 L 0,-4.519999980926514" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker38" orient="auto" style="overflow:visible;"> <g> <path d=" M 0,1.1299999952316284 L 0,-1.1299999952316284" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker39" orient="auto" style="overflow:visible;"> <g> <path d=" M -0.22470422089099884,-0.027415549382567406 C -0.22470422089099884,1.6285845041275024 1.1192958354949951,2.9725847244262695 2.7752959728240967,2.9725847244262695 L 2.7752959728240967,-3.0274155139923096 C 1.1192958354949951,-3.0274155139923096 -0.22470422089099884,-1.6834156513214111 -0.22470422089099884,-0.027415549382567406 Z" fill="#000000" stroke="none"/> <path d=" M -0.22470422089099884,-0.027415549382567406 C -0.22470422089099884,1.6285845041275024 1.1192958354949951,2.9725847244262695 2.7752959728240967,2.9725847244262695 L 2.7752959728240967,-3.0274155139923096 C 1.1192958354949951,-3.0274155139923096 -0.22470422089099884,-1.6834156513214111 -0.22470422089099884,-0.027415549382567406 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker40" orient="auto" style="overflow:visible;"> <g> <path d=" M 2.7752959728240967,-0.027415575459599495 C 2.7752959728240967,1.6285845041275024 1.4312959909439087,2.9725844860076904 -0.22470417618751526,2.9725844860076904 L -0.22470417618751526,-3.0274157524108887 C 1.4312959909439087,-3.0274157524108887 2.7752959728240967,-1.6834156513214111 2.7752959728240967,-0.027415575459599495 Z" fill="#000000" stroke="none"/> <path d=" M 2.7752959728240967,-0.027415575459599495 C 2.7752959728240967,1.6285845041275024 1.4312959909439087,2.9725844860076904 -0.22470417618751526,2.9725844860076904 L -0.22470417618751526,-3.0274157524108887 C 1.4312959909439087,-3.0274157524108887 2.7752959728240967,-1.6834156513214111 2.7752959728240967,-0.027415575459599495 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker41" orient="auto" style="overflow:visible;"> <g> <path d=" M 2.7752959728240967,-3.0274155139923096 C 1.1192958354949951,-3.0274155139923096 -0.22470422089099884,-1.6834156513214111 -0.22470422089099884,-0.027415549382567406 C -0.22470422089099884,1.6285845041275024 1.1192958354949951,2.9725847244262695 2.7752959728240967,2.9725847244262695" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker42" orient="auto" style="overflow:visible;"> <g> <path d=" M -3.2477951049804688,-3.0274155139923096 C -1.5917948484420776,-3.0274155139923096 -0.24779479205608368,-1.6834156513214111 -0.24779479205608368,-0.027415549382567406 C -0.24779479205608368,1.6285845041275024 -1.5917948484420776,2.9725847244262695 -3.2477951049804688,2.9725847244262695" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> <marker id="marker43" orient="auto" style="overflow:visible;"> <g> <g fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"> <path d=" M 9.089885711669922,-3.6061017513275146 C 8.119884490966797,-4.7769975662231445 6.369760513305664,-4.7358293533325195 5.062355995178223,-4.232773303985596 L -3.1500487327575684,-1.1548705101013184 C -5.538341999053955,-2.4615840911865234 -7.898335933685303,-2.0874075889587402 -7.898335933685303,-2.7236578464508057 C -7.898335933685303,-3.2209742069244385 -7.441669940948486,-3.1119799613952637 -7.510029315948486,-4.406851768493652 C -7.57566499710083,-5.650128364562988 -8.87360668182373,-6.569931507110596 -10.100427627563477,-6.488495349884033 C -11.327698707580566,-6.495850086212158 -12.59986686706543,-5.555334091186523 -12.610769271850586,-4.258434295654297 C -12.702194213867188,-2.952047824859619 -11.603560447692871,-1.7387447357177734 -10.304004669189453,-1.6532026529312134 C -8.781664848327637,-1.4265410900115967 -6.085746765136719,-2.348759412765503 -4.8210601806640625,-0.08234263956546783 C -5.763344764709473,1.6559151411056519 -7.435084342956543,1.6607340574264526 -8.94657039642334,1.5737277269363403 C -10.201444625854492,1.5014928579330444 -11.708663940429688,1.8611255884170532 -12.307218551635742,3.094588279724121 C -12.88558578491211,4.276674270629883 -12.318421363830566,5.959190368652344 -10.990469932556152,6.321000099182129 C -9.65027904510498,6.812828063964844 -7.80980110168457,6.19128942489624 -7.491097927093506,4.650276184082031 C -7.245439529418945,3.4624528884887695 -8.086463928222656,2.9043185710906982 -7.763605117797852,2.4731223583221436 C -7.519991874694824,2.1477622985839844 -5.972824573516846,2.3362770080566406 -3.2164998054504395,1.0982979536056519 L 5.676346778869629,4.233068943023682 C 6.800016403198242,4.546767234802246 8.173068046569824,4.536264419555664 9.16844367980957,3.431361436843872 L -0.05164093151688576,-0.05372221767902374 L 9.089885711669922,-3.6061017513275146 Z"/> <path d=" M -9.217915534973145,-5.506605625152588 C -7.923357009887695,-4.783805847167969 -8.02907657623291,-2.823035717010498 -9.374342918395996,-2.44331693649292 C -10.590861320495605,-2.01965594291687 -12.145369529724121,-3.2022862434387207 -11.75752067565918,-4.520781517028809 C -11.530372619628906,-5.602633476257324 -10.104133605957031,-6.001413822174072 -9.217915534973145,-5.506605625152588 Z"/> <path d=" M -9.161651611328125,2.510759115219116 C -7.810821533203125,3.0096240043640137 -8.04020881652832,5.295194625854492 -9.413872718811035,5.602367877960205 C -10.324932098388672,5.918707370758057 -11.627422332763672,5.463570594787598 -11.719569206237793,4.390228748321533 C -11.897177696228027,3.0851736068725586 -10.363484382629395,1.9060804843902588 -9.161651611328125,2.510759115219116 Z"/> </g> </g> </marker> <marker id="marker44" orient="auto" style="overflow:visible;"> <g> <path d=" M -0.9582820534706116,-4.258658409118652 C -2.0918326377868652,-4.258658409118652 -3.014111280441284,-3.3363795280456543 -3.014111280441284,-2.202828884124756 C -3.014111280441284,-1.8088210821151733 -2.8710994720458984,-1.4666733741760254 -2.6784658432006836,-1.1539362668991089 C -2.701716661453247,-1.1346694231033325 -2.726268768310547,-1.118858814239502 -2.748392105102539,-1.0979952812194824 C -3.1218459606170654,-1.6109910011291504 -3.702031135559082,-1.9650797843933105 -4.384664058685303,-1.9650797843933105 C -5.518214702606201,-1.9650799036026 -6.440493106842041,-1.042801022529602 -6.440493106842041,0.09074948728084564 C -6.440493106842041,1.2243000268936157 -5.518214702606201,2.146578788757324 -4.384664058685303,2.146578788757324 C -3.7885961532592773,2.146578788757324 -3.2634925842285156,1.8813422918319702 -2.888244152069092,1.475287675857544 C -2.9630565643310547,1.6882225275039673 -3.014111280441284,1.9081801176071167 -3.014111280441284,2.146578788757324 C -3.014111280441284,3.2801291942596436 -2.0918326377868652,4.202408313751221 -0.9582820534706116,4.202408313751221 C 0.17526836693286896,4.202408313751221 1.0975472927093506,3.2801291942596436 1.0975472927093506,2.146578788757324 C 1.0975472927093506,1.6705414056777954 0.9082121253013611,1.2502816915512085 0.6360346078872681,0.9018930196762085 C 1.4491630792617798,1.0598320960998535 2.2631025314331055,1.378422737121582 2.8596866130828857,2.3004164695739746 C 2.4167680740356445,1.8574974536895752 2.1324546337127686,1.0520470142364502 2.1324546337127686,-0.03511761873960495 L 1.7548532485961914,-0.06308808922767639 L 2.1044840812683105,-0.07707332074642181 C 2.1044840812683105,-1.1642379760742188 2.374812126159668,-1.9696882963180542 2.8177311420440674,-2.412607431411743 C 2.242276668548584,-1.5232689380645752 1.463433027267456,-1.1967898607254028 0.6779903173446655,-1.028069257736206 C 0.9205081462860107,-1.3652147054672241 1.0975472927093506,-1.7561134099960327 1.0975472927093506,-2.202828884124756 C 1.0975472927093506,-3.336379289627075 0.17526836693286896,-4.258658409118652 -0.9582820534706116,-4.258658409118652 Z" fill="#000000" stroke="none"/> <path d=" M -0.9582820534706116,-4.258658409118652 C -2.0918326377868652,-4.258658409118652 -3.014111280441284,-3.3363795280456543 -3.014111280441284,-2.202828884124756 C -3.014111280441284,-1.8088210821151733 -2.8710994720458984,-1.4666733741760254 -2.6784658432006836,-1.1539362668991089 C -2.701716661453247,-1.1346694231033325 -2.726268768310547,-1.118858814239502 -2.748392105102539,-1.0979952812194824 C -3.1218459606170654,-1.6109910011291504 -3.702031135559082,-1.9650797843933105 -4.384664058685303,-1.9650797843933105 C -5.518214702606201,-1.9650799036026 -6.440493106842041,-1.042801022529602 -6.440493106842041,0.09074948728084564 C -6.440493106842041,1.2243000268936157 -5.518214702606201,2.146578788757324 -4.384664058685303,2.146578788757324 C -3.7885961532592773,2.146578788757324 -3.2634925842285156,1.8813422918319702 -2.888244152069092,1.475287675857544 C -2.9630565643310547,1.6882225275039673 -3.014111280441284,1.9081801176071167 -3.014111280441284,2.146578788757324 C -3.014111280441284,3.2801291942596436 -2.0918326377868652,4.202408313751221 -0.9582820534706116,4.202408313751221 C 0.17526836693286896,4.202408313751221 1.0975472927093506,3.2801291942596436 1.0975472927093506,2.146578788757324 C 1.0975472927093506,1.6705414056777954 0.9082121253013611,1.2502816915512085 0.6360346078872681,0.9018930196762085 C 1.4491630792617798,1.0598320960998535 2.2631025314331055,1.378422737121582 2.8596866130828857,2.3004164695739746 C 2.4167680740356445,1.8574974536895752 2.1324546337127686,1.0520470142364502 2.1324546337127686,-0.03511761873960495 L 1.7548532485961914,-0.06308808922767639 L 2.1044840812683105,-0.07707332074642181 C 2.1044840812683105,-1.1642379760742188 2.374812126159668,-1.9696882963180542 2.8177311420440674,-2.412607431411743 C 2.242276668548584,-1.5232689380645752 1.463433027267456,-1.1967898607254028 0.6779903173446655,-1.028069257736206 C 0.9205081462860107,-1.3652147054672241 1.0975472927093506,-1.7561134099960327 1.0975472927093506,-2.202828884124756 C 1.0975472927093506,-3.336379289627075 0.17526836693286896,-4.258658409118652 -0.9582820534706116,-4.258658409118652 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </g> </marker> </defs> <path d=" M 5.714285850524902,5.714285850524902 L 8.571428298950195,14.285714149475098 L 11.428571701049805,22.85714340209961" fill="none" marker-end="url(#marker1)" marker-mid="url(#marker1)" marker-start="url(#marker1)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 34.28571319580078,5.714285850524902 L 37.14285659790039,14.285714149475098 L 40,22.85714340209961" fill="none" marker-end="url(#marker2)" marker-mid="url(#marker2)" marker-start="url(#marker2)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 62.85714340209961,5.714285850524902 L 65.71428680419922,14.285714149475098 L 68.57142639160156,22.85714340209961" fill="none" marker-end="url(#marker3)" marker-mid="url(#marker3)" marker-start="url(#marker3)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 91.42857360839844,5.714285850524902 L 94.28571319580078,14.285714149475098 L 97.14286041259766,22.85714340209961" fill="none" marker-end="url(#marker4)" marker-mid="url(#marker4)" marker-start="url(#marker4)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 120,5.714285850524902 L 122.85713958740234,14.285714149475098 L 125.71428680419922,22.85714340209961" fill="none" marker-end="url(#marker5)" marker-mid="url(#marker5)" marker-start="url(#marker5)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 148.57142639160156,5.714285850524902 L 151.42857360839844,14.285714149475098 L 154.2857208251953,22.85714340209961" fill="none" marker-end="url(#marker6)" marker-mid="url(#marker6)" marker-start="url(#marker6)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 177.14285278320312,5.714285850524902 L 180,14.285714149475098 L 182.85714721679688,22.85714340209961" fill="none" marker-end="url(#marker7)" marker-mid="url(#marker7)" marker-start="url(#marker7)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 5.714285850524902,34.28571319580078 L 8.571428298950195,42.85714340209961 L 11.428571701049805,51.42856979370117" fill="none" marker-end="url(#marker8)" marker-mid="url(#marker8)" marker-start="url(#marker8)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 34.28571319580078,34.28571319580078 L 37.14285659790039,42.85714340209961 L 40,51.42856979370117" fill="none" marker-end="url(#marker9)" marker-mid="url(#marker9)" marker-start="url(#marker9)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 62.85714340209961,34.28571319580078 L 65.71428680419922,42.85714340209961 L 68.57142639160156,51.42856979370117" fill="none" marker-end="url(#marker10)" marker-mid="url(#marker10)" marker-start="url(#marker10)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 91.42857360839844,34.28571319580078 L 94.28571319580078,42.85714340209961 L 97.14286041259766,51.42856979370117" fill="none" marker-end="url(#marker11)" marker-mid="url(#marker11)" marker-start="url(#marker11)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 120,34.28571319580078 L 122.85713958740234,42.85714340209961 L 125.71428680419922,51.42856979370117" fill="none" marker-end="url(#marker12)" marker-mid="url(#marker12)" marker-start="url(#marker12)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 148.57142639160156,34.28571319580078 L 151.42857360839844,42.85714340209961 L 154.2857208251953,51.42856979370117" fill="none" marker-end="url(#marker13)" marker-mid="url(#marker13)" marker-start="url(#marker13)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 177.14285278320312,34.28571319580078 L 180,42.85714340209961 L 182.85714721679688,51.42856979370117" fill="none" marker-end="url(#marker14)" marker-mid="url(#marker14)" marker-start="url(#marker14)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 5.714285850524902,62.85714340209961 L 8.571428298950195,71.42857360839844 L 11.428571701049805,80" fill="none" marker-end="url(#marker15)" marker-mid="url(#marker15)" marker-start="url(#marker15)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 34.28571319580078,62.85714340209961 L 37.14285659790039,71.42857360839844 L 40,80" fill="none" marker-end="url(#marker16)" marker-mid="url(#marker16)" marker-start="url(#marker16)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 62.85714340209961,62.85714340209961 L 65.71428680419922,71.42857360839844 L 68.57142639160156,80" fill="none" marker-end="url(#marker17)" marker-mid="url(#marker17)" marker-start="url(#marker17)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 91.42857360839844,62.85714340209961 L 94.28571319580078,71.42857360839844 L 97.14286041259766,80" fill="none" marker-end="url(#marker18)" marker-mid="url(#marker18)" marker-start="url(#marker18)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 120,62.85714340209961 L 122.85713958740234,71.42857360839844 L 125.71428680419922,80" fill="none" marker-end="url(#marker19)" marker-mid="url(#marker19)" marker-start="url(#marker19)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 148.57142639160156,62.85714340209961 L 151.42857360839844,71.42857360839844 L 154.2857208251953,80" fill="none" marker-end="url(#marker20)" marker-mid="url(#marker20)" marker-start="url(#marker20)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 177.14285278320312,62.85714340209961 L 180,71.42857360839844 L 182.85714721679688,80" fill="none" marker-end="url(#marker21)" marker-mid="url(#marker21)" marker-start="url(#marker21)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 5.714285850524902,91.42857360839844 L 8.571428298950195,100 L 11.428571701049805,108.57142639160156" fill="none" marker-end="url(#marker22)" marker-mid="url(#marker22)" marker-start="url(#marker22)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 34.28571319580078,91.42857360839844 L 37.14285659790039,100 L 40,108.57142639160156" fill="none" marker-end="url(#marker23)" marker-mid="url(#marker23)" marker-start="url(#marker23)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 62.85714340209961,91.42857360839844 L 65.71428680419922,100 L 68.57142639160156,108.57142639160156" fill="none" marker-end="url(#marker24)" marker-mid="url(#marker24)" marker-start="url(#marker24)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 91.42857360839844,91.42857360839844 L 94.28571319580078,100 L 97.14286041259766,108.57142639160156" fill="none" marker-end="url(#marker25)" marker-mid="url(#marker25)" marker-start="url(#marker25)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 120,91.42857360839844 L 122.85713958740234,100 L 125.71428680419922,108.57142639160156" fill="none" marker-end="url(#marker26)" marker-mid="url(#marker26)" marker-start="url(#marker26)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 148.57142639160156,91.42857360839844 L 151.42857360839844,100 L 154.2857208251953,108.57142639160156" fill="none" marker-end="url(#marker27)" marker-mid="url(#marker27)" marker-start="url(#marker27)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 177.14285278320312,91.42857360839844 L 180,100 L 182.85714721679688,108.57142639160156" fill="none" marker-end="url(#marker28)" marker-mid="url(#marker28)" marker-start="url(#marker28)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 5.714285850524902,120 L 8.571428298950195,128.57142639160156 L 11.428571701049805,137.14285278320312" fill="none" marker-end="url(#marker29)" marker-mid="url(#marker29)" marker-start="url(#marker29)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 34.28571319580078,120 L 37.14285659790039,128.57142639160156 L 40,137.14285278320312" fill="none" marker-end="url(#marker30)" marker-mid="url(#marker30)" marker-start="url(#marker30)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 62.85714340209961,120 L 65.71428680419922,128.57142639160156 L 68.57142639160156,137.14285278320312" fill="none" marker-end="url(#marker31)" marker-mid="url(#marker31)" marker-start="url(#marker31)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 91.42857360839844,120 L 94.28571319580078,128.57142639160156 L 97.14286041259766,137.14285278320312" fill="none" marker-end="url(#marker32)" marker-mid="url(#marker32)" marker-start="url(#marker32)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 120,120 L 122.85713958740234,128.57142639160156 L 125.71428680419922,137.14285278320312" fill="none" marker-end="url(#marker33)" marker-mid="url(#marker33)" marker-start="url(#marker33)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 148.57142639160156,120 L 151.42857360839844,128.57142639160156 L 154.2857208251953,137.14285278320312" fill="none" marker-end="url(#marker34)" marker-mid="url(#marker34)" marker-start="url(#marker34)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 177.14285278320312,120 L 180,128.57142639160156 L 182.85714721679688,137.14285278320312" fill="none" marker-end="url(#marker35)" marker-mid="url(#marker35)" marker-start="url(#marker35)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 5.714285850524902,148.57142639160156 L 8.571428298950195,157.14285278320312 L 11.428571701049805,165.7142791748047" fill="none" marker-end="url(#marker36)" marker-mid="url(#marker36)" marker-start="url(#marker36)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 34.28571319580078,148.57142639160156 L 37.14285659790039,157.14285278320312 L 40,165.7142791748047" fill="none" marker-end="url(#marker37)" marker-mid="url(#marker37)" marker-start="url(#marker37)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 62.85714340209961,148.57142639160156 L 65.71428680419922,157.14285278320312 L 68.57142639160156,165.7142791748047" fill="none" marker-end="url(#marker38)" marker-mid="url(#marker38)" marker-start="url(#marker38)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 91.42857360839844,148.57142639160156 L 94.28571319580078,157.14285278320312 L 97.14286041259766,165.7142791748047" fill="none" marker-end="url(#marker39)" marker-mid="url(#marker39)" marker-start="url(#marker39)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 120,148.57142639160156 L 122.85713958740234,157.14285278320312 L 125.71428680419922,165.7142791748047" fill="none" marker-end="url(#marker40)" marker-mid="url(#marker40)" marker-start="url(#marker40)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 148.57142639160156,148.57142639160156 L 151.42857360839844,157.14285278320312 L 154.2857208251953,165.7142791748047" fill="none" marker-end="url(#marker41)" marker-mid="url(#marker41)" marker-start="url(#marker41)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 177.14285278320312,148.57142639160156 L 180,157.14285278320312 L 182.85714721679688,165.7142791748047" fill="none" marker-end="url(#marker42)" marker-mid="url(#marker42)" marker-start="url(#marker42)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 5.714285850524902,177.14285278320312 L 8.571428298950195,185.7142791748047 L 11.428571701049805,194.2857208251953" fill="none" marker-end="url(#marker43)" marker-mid="url(#marker43)" marker-start="url(#marker43)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 34.28571319580078,177.14285278320312 L 37.14285659790039,185.7142791748047 L 40,194.2857208251953" fill="none" marker-end="url(#marker44)" marker-mid="url(#marker44)" marker-start="url(#marker44)" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> </svg>
6: gears
function (c) { var n = 11; var bottom = 85; var diagonal = 70; var center = 100; var height = Math.sqrt(diagonal*diagonal-bottom*bottom/4) var r = diagonal/2 var a = Math.acos(bottom/(2*diagonal)) c.save() c.beginPath() c.moveTo(center,center) c.lineTo(center-bottom/2,center+height) c.stroke() c.restore() c.save() c.translate(center,center) var g1 = c.newGroup() c.beginPath(); c.moveTo(0,0) c.lineTo(bottom/2,-height) c.lineTo(-bottom/2,-height) c.stroke() c.beginPath(); c.rotate(-a+Math.PI/n) c.gear(n, .2,r-5, .3,r+2, .4,r+5, .6,r+5, .7,r+2, .8,r-5); c.stroke(); c.restore() c.save() c.translate(center-bottom/2,center+height); var g2 = c.newGroup() c.beginPath(); c.moveTo(0,0) c.lineTo(bottom,0) c.stroke() c.beginPath(); c.rotate(-a) c.gear(n, .2,r-5, .3,r+2, .4,r+5, .6,r+5, .7,r+2, .8,r-5); c.stroke(); c.restore() var rotate = 0.0 * 2*a c.svg.rotate(g1 ,rotate/Math.PI*180) c.svg.rotate(g2 ,-rotate/Math.PI*180) }
<svg baseProfile="full" height="200" version="1.1" width="200" xmlns="http://www.w3.org/2000/svg" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <path d=" M 100,100 L 57.5,155.62149047851562" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <g transform=" matrix(1,0,0,1,100,100)"> <path d=" M 0,0 L 42.5,-55.621490478515625 L -42.5,-55.621490478515625" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 1.8369700935892946e-15,-30 L 3.4197423458099365,-29.804452896118164 L 6.30932092666626,-36.458091735839844 L 9.059870719909668,-38.96047592163086 L 13.441975593566895,-37.67377471923828 L 14.402994155883789,-34.081573486328125 L 13.23663330078125,-26.921953201293945 L 18.990373611450195,-23.2242488861084 L 25.018470764160156,-27.259422302246094 L 28.685272216796875,-27.87750244140625 L 31.676090240478516,-24.425914764404297 L 30.54245948791504,-20.8843994140625 L 25.690471649169922,-15.491924285888672 L 28.531696319580078,-9.270509719848633 L 35.7844352722168,-9.406078338623047 L 39.203304290771484,-7.9436187744140625 L 39.853267669677734,-3.4230003356933594 L 36.98491287231445,-1.0565738677978516 L 29.98776626586914,0.8566815257072449 L 29.014406204223633,7.626550197601318 L 35.189090728759766,11.433629035949707 L 37.27456283569336,14.512308120727539 L 35.377315521240234,18.66669273376465 L 31.684913635253906,19.106706619262695 L 24.764156341552734,16.93329620361328 L 20.285247802734375,22.10223388671875 L 23.42146110534668,28.643239974975586 L 23.511409759521484,32.360679626464844 L 19.6693172454834,34.82984161376953 L 16.325180053710938,33.20374298095703 L 11.67810344696045,27.633708953857422 L 5.115665912628174,29.56061553955078 L 4.217682361602783,36.75882339477539 L 2.283552408218384,39.93476486206055 L -2.283552408218384,39.93476486206055 L -4.217682361602783,36.75882339477539 L -5.115665912628174,29.56061553955078 L -11.67810344696045,27.633708953857422 L -16.325180053710938,33.20374298095703 L -19.6693172454834,34.82984161376953 L -23.511409759521484,32.360679626464844 L -23.42146110534668,28.643239974975586 L -20.285247802734375,22.10223388671875 L -24.764156341552734,16.93329620361328 L -31.684913635253906,19.106706619262695 L -35.377315521240234,18.66669273376465 L -37.27456283569336,14.512308120727539 L -35.189090728759766,11.433629035949707 L -29.014406204223633,7.626550197601318 L -29.98776626586914,0.8566815257072449 L -36.98491287231445,-1.0565738677978516 L -39.853267669677734,-3.4230003356933594 L -39.203304290771484,-7.9436187744140625 L -35.7844352722168,-9.406078338623047 L -28.531696319580078,-9.270509719848633 L -25.690471649169922,-15.491924285888672 L -30.54245948791504,-20.8843994140625 L -31.676090240478516,-24.425914764404297 L -28.685272216796875,-27.87750244140625 L -25.018470764160156,-27.259422302246094 L -18.990373611450195,-23.2242488861084 L -13.23663330078125,-26.921953201293945 L -14.402994155883789,-34.081573486328125 L -13.441975593566895,-37.67377471923828 L -9.059870719909668,-38.96047592163086 L -6.30932092666626,-36.458091735839844 L -3.4197423458099365,-29.804452896118164 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="rotate(-36.25316521849875)"/> </g> <g transform=" matrix(1,0,0,1,57.5,155.62149047851562)"> <path d=" M 0,0 L 85,0" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1"/> <path d=" M 1.8369700935892946e-15,-30 L 3.4197423458099365,-29.804452896118164 L 6.30932092666626,-36.458091735839844 L 9.059870719909668,-38.96047592163086 L 13.441975593566895,-37.67377471923828 L 14.402994155883789,-34.081573486328125 L 13.23663330078125,-26.921953201293945 L 18.990373611450195,-23.2242488861084 L 25.018470764160156,-27.259422302246094 L 28.685272216796875,-27.87750244140625 L 31.676090240478516,-24.425914764404297 L 30.54245948791504,-20.8843994140625 L 25.690471649169922,-15.491924285888672 L 28.531696319580078,-9.270509719848633 L 35.7844352722168,-9.406078338623047 L 39.203304290771484,-7.9436187744140625 L 39.853267669677734,-3.4230003356933594 L 36.98491287231445,-1.0565738677978516 L 29.98776626586914,0.8566815257072449 L 29.014406204223633,7.626550197601318 L 35.189090728759766,11.433629035949707 L 37.27456283569336,14.512308120727539 L 35.377315521240234,18.66669273376465 L 31.684913635253906,19.106706619262695 L 24.764156341552734,16.93329620361328 L 20.285247802734375,22.10223388671875 L 23.42146110534668,28.643239974975586 L 23.511409759521484,32.360679626464844 L 19.6693172454834,34.82984161376953 L 16.325180053710938,33.20374298095703 L 11.67810344696045,27.633708953857422 L 5.115665912628174,29.56061553955078 L 4.217682361602783,36.75882339477539 L 2.283552408218384,39.93476486206055 L -2.283552408218384,39.93476486206055 L -4.217682361602783,36.75882339477539 L -5.115665912628174,29.56061553955078 L -11.67810344696045,27.633708953857422 L -16.325180053710938,33.20374298095703 L -19.6693172454834,34.82984161376953 L -23.511409759521484,32.360679626464844 L -23.42146110534668,28.643239974975586 L -20.285247802734375,22.10223388671875 L -24.764156341552734,16.93329620361328 L -31.684913635253906,19.106706619262695 L -35.377315521240234,18.66669273376465 L -37.27456283569336,14.512308120727539 L -35.189090728759766,11.433629035949707 L -29.014406204223633,7.626550197601318 L -29.98776626586914,0.8566815257072449 L -36.98491287231445,-1.0565738677978516 L -39.853267669677734,-3.4230003356933594 L -39.203304290771484,-7.9436187744140625 L -35.7844352722168,-9.406078338623047 L -28.531696319580078,-9.270509719848633 L -25.690471649169922,-15.491924285888672 L -30.54245948791504,-20.8843994140625 L -31.676090240478516,-24.425914764404297 L -28.685272216796875,-27.87750244140625 L -25.018470764160156,-27.259422302246094 L -18.990373611450195,-23.2242488861084 L -13.23663330078125,-26.921953201293945 L -14.402994155883789,-34.081573486328125 L -13.441975593566895,-37.67377471923828 L -9.059870719909668,-38.96047592163086 L -6.30932092666626,-36.458091735839844 L -3.4197423458099365,-29.804452896118164 Z" fill="none" stroke="#000000" stroke-linecap="butt" stroke-linejoin="miter" stroke-width="1" transform="rotate(-52.616801582135125)"/> </g> </svg>
7: lorentz_transform
function(ctx) { var v = 3.0/5.0 // Gives nice, round gamma var gamma = 1/Math.sqrt(1-v*v) // x_lab = gamma * ( x_rocket - v * t_rocket ) // t_lab = gamma * ( - v * x_rocket + t_rocket ) with (ctx) { // This function will draw the grid in x and y var grid = function(number, step) { var limit = number*step var old_lineWidth = lineWidth for (var p=-limit; p<=limit; p+=step) { // TODO: Maybe make the alpha bigger rather than the line var width_multiplier = (p==0) ? 2 : 1 lineWidth = old_lineWidth * width_multiplier beginPath(); moveTo(p, -limit); lineTo(p, limit); stroke(); beginPath(); moveTo(-limit, p); lineTo(limit, p); stroke(); repeat = repeat - 1 } lineWidth = old_lineWidth // Just to be sure if only main axis is drawn. } // First, center things translate(100,100) // Draw the lab-frame grid in red save() newGroup() strokeStyle='rgba(255,0,0,.2)' grid(5, 20) restore() // Draw the rocket frame grid in blue save() matrix( gamma, -gamma*v, -gamma*v, gamma ) newGroup() strokeStyle='rgba(0,0,255,.2)' grid(5, 20) restore() /* Of course, simultaneously you'll want to show what happens from the rocket perspective where the lab coordinates get lorentz boosted in the opposite direciton */ } }
<svg baseProfile="full" height="200" version="1.1" width="200" xmlns="http://www.w3.org/2000/svg" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <g transform="translate(100,100)"> <path d=" M -100,-100 L -100,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,-100 L 100,-100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -80,-100 L -80,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,-80 L 100,-80" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -60,-100 L -60,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,-60 L 100,-60" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -40,-100 L -40,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,-40 L 100,-40" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -20,-100 L -20,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,-20 L 100,-20" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M 0,-100 L 0,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="2"/> <path d=" M -100,0 L 100,0" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="2"/> <path d=" M 20,-100 L 20,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,20 L 100,20" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M 40,-100 L 40,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,40 L 100,40" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M 60,-100 L 60,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,60 L 100,60" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M 80,-100 L 80,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,80 L 100,80" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M 100,-100 L 100,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,100 L 100,100" fill="none" stroke="#ff0000" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> </g> <g transform="translate(100,100) matrix(1.25,-0.75,-0.75,1.25,0,0)"> <path d=" M -100,-100 L -100,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,-100 L 100,-100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -80,-100 L -80,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,-80 L 100,-80" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -60,-100 L -60,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,-60 L 100,-60" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -40,-100 L -40,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,-40 L 100,-40" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -20,-100 L -20,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,-20 L 100,-20" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M 0,-100 L 0,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="2"/> <path d=" M -100,0 L 100,0" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="2"/> <path d=" M 20,-100 L 20,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,20 L 100,20" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M 40,-100 L 40,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,40 L 100,40" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M 60,-100 L 60,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,60 L 100,60" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M 80,-100 L 80,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,80 L 100,80" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M 100,-100 L 100,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> <path d=" M -100,100 L 100,100" fill="none" stroke="#0000ff" stroke-linecap="butt" stroke-linejoin="miter" stroke-opacity="0.2" stroke-width="1"/> </g> </svg>
