1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
|
<!DOCTYPE html>
<html>
<head>
<title>Inkscape Output</title>
</head>
<body>
<canvas id='canvas' width='793' height='1122'></canvas>
<script>
var ctx = document.getElementById("canvas").getContext("2d");
// #layer3
// #g3930
// #path3902
ctx.save();
ctx.beginPath();
ctx.transform(-0.971767, -0.235942, 0.235942, -0.971767, 541.898000, 1030.860000);
ctx.fillStyle = 'rgb(255, 204, 170)';
ctx.moveTo(431.428570, 463.790760);
ctx.lineTo(283.139170, 424.837610);
ctx.lineTo(166.982970, 524.911760);
ctx.lineTo(158.205670, 371.842960);
ctx.lineTo(27.135259, 292.296470);
ctx.lineTo(170.000000, 236.647900);
ctx.lineTo(205.150230, 87.411314);
ctx.lineTo(302.222790, 206.087400);
ctx.lineTo(455.017240, 193.400620);
ctx.lineTo(372.146640, 322.395040);
ctx.closePath();
ctx.fill();
ctx.restore();
// #text3926
ctx.fillStyle = 'rgb(0, 0, 0)';
ctx.font = "normal normal 40px Sans";
ctx.fillText("Bottom layer", 245.714290, 723.790770);
// #layer2
// #layer4
// #path3900
ctx.beginPath();
ctx.fillStyle = 'rgb(255, 170, 170)';
ctx.moveTo(522.857140, 488.076480);
ctx.bezierCurveTo(522.857140, 561.451460, 451.222700, 620.933630, 362.857140, 620.933630);
ctx.bezierCurveTo(274.491580, 620.933630, 202.857150, 561.451460, 202.857150, 488.076480);
ctx.bezierCurveTo(202.857150, 414.701510, 274.491580, 355.219340, 362.857140, 355.219340);
ctx.bezierCurveTo(451.222700, 355.219340, 522.857140, 414.701510, 522.857140, 488.076480);
ctx.closePath();
ctx.fill();
// #text3918
// TextPath elements are not supported
// #g3913
ctx.save();
ctx.transform(1.000000, 0.000000, 0.000000, 1.000000, 8.571430, -94.285700);
// #rect3898
ctx.beginPath();
ctx.fillStyle = 'rgb(204, 204, 204)';
ctx.rect(162.857150, 406.647890, 385.714290, 134.285720);
ctx.fill();
// #text3909
ctx.fillStyle = 'rgb(0, 0, 0)';
ctx.font = "normal normal 40px Sans";
ctx.fillText("Middle layer", 294.285710, 520.933650);
ctx.restore();
// #layer1
// #text3894
// TextPath elements are not supported
// #path3904
ctx.beginPath();
ctx.fillStyle = 'rgb(0, 212, 170)';
ctx.moveTo(199.544030, 352.969100);
ctx.bezierCurveTo(233.442580, 329.577360, 271.650540, 316.012310, 309.336550, 300.484470);
ctx.bezierCurveTo(317.049990, 297.291210, 324.782330, 294.143230, 332.476870, 290.904690);
ctx.bezierCurveTo(358.507900, 279.948560, 384.264970, 268.310820, 409.267930, 255.143120);
ctx.bezierCurveTo(451.593000, 232.852810, 441.646470, 237.692940, 430.984880, 242.768990);
ctx.bezierCurveTo(458.684470, 225.869570, 485.747460, 207.961360, 513.053290, 190.439450);
ctx.bezierCurveTo(517.000050, 187.906850, 520.838710, 185.200990, 524.868760, 182.803160);
ctx.bezierCurveTo(538.799830, 174.514350, 552.906890, 166.524980, 566.925950, 158.385890);
ctx.bezierCurveTo(568.746800, 157.732880, 570.460950, 156.589640, 572.388480, 156.426860);
ctx.bezierCurveTo(573.535960, 156.329960, 574.941770, 156.720210, 575.618720, 157.651790);
ctx.bezierCurveTo(580.058920, 163.762100, 572.871270, 173.210800, 570.134210, 178.379970);
ctx.bezierCurveTo(564.376560, 188.952910, 558.333140, 199.386690, 551.758530, 209.474220);
ctx.bezierCurveTo(543.061710, 221.606260, 534.542400, 233.825290, 526.453080, 246.373620);
ctx.bezierCurveTo(517.683090, 260.436840, 512.645840, 276.234520, 509.290310, 292.348680);
ctx.bezierCurveTo(507.670490, 301.380030, 506.983900, 308.793990, 515.525240, 314.056970);
ctx.bezierCurveTo(518.835250, 315.768880, 522.138190, 316.254920, 525.788310, 316.315110);
ctx.lineTo(491.632410, 340.564310);
ctx.lineTo(491.632410, 340.564310);
ctx.bezierCurveTo(487.589670, 339.783370, 483.751040, 338.815720, 480.247480, 336.505630);
ctx.bezierCurveTo(470.668620, 329.004290, 470.202370, 321.780830, 472.293800, 310.214850);
ctx.bezierCurveTo(476.003560, 293.731570, 480.885390, 277.359150, 489.432750, 262.665610);
ctx.bezierCurveTo(497.240750, 250.227690, 505.146760, 237.898120, 513.863720, 226.082720);
ctx.bezierCurveTo(520.508350, 216.070420, 526.851730, 205.855340, 532.563670, 195.275530);
ctx.bezierCurveTo(533.630400, 193.254540, 538.042220, 183.301660, 539.396690, 181.836310);
ctx.bezierCurveTo(539.738890, 181.466100, 540.460630, 181.516180, 540.906720, 181.751110);
ctx.bezierCurveTo(541.258930, 181.936560, 540.130850, 181.929470, 539.742920, 182.018660);
ctx.bezierCurveTo(538.350520, 182.595150, 536.958120, 183.171650, 535.565720, 183.748150);
ctx.bezierCurveTo(544.098810, 178.730330, 552.492980, 173.468410, 561.165000, 168.694700);
ctx.bezierCurveTo(565.632030, 166.235720, 552.519960, 174.104650, 548.190530, 176.798530);
ctx.bezierCurveTo(519.851750, 194.431600, 491.948050, 212.740720, 463.522280, 230.234820);
ctx.bezierCurveTo(440.858730, 243.484180, 407.607170, 263.590820, 381.881790, 277.041290);
ctx.bezierCurveTo(348.929370, 294.270420, 314.755180, 308.981580, 280.453080, 323.267890);
ctx.bezierCurveTo(262.262930, 330.961770, 243.831330, 338.245390, 225.900460, 346.538310);
ctx.bezierCurveTo(222.122020, 348.285810, 218.394970, 350.144130, 214.686250, 352.035100);
ctx.bezierCurveTo(212.155040, 353.325700, 204.745450, 357.539260, 207.184090, 356.081270);
ctx.bezierCurveTo(217.673090, 349.810220, 228.289930, 343.755500, 238.842850, 337.592610);
ctx.lineTo(199.544030, 352.969140);
ctx.closePath();
ctx.fill();
</script>
</body>
</html>
|