const width = 200;
const height = 150;
const {
draw_arrow,
draw_arrowhead,
} = canvas_tools;
const canvas_renderer = (canvas) => {
const ctx = canvas.getContext('2d');
// re-center and orient y-axis upward
ctx.translate(width/2, height);
ctx.scale(1, -1); // flip so that y increases up
draw_arrow(ctx, -100, 100, 100, 100, {
double: true,
len: 20,
tick: 20,
label: 'ARROW!',
label_options: {
dxr: 0,
dyr: 1,
clear: true,
padding: 0,
},
});
draw_arrowhead(ctx, 0, 100, 0, 1);
};
const canvas = ocx.create_child({
tag: 'canvas',
attrs: { width, height },
});
await canvas_renderer(canvas);
const width = 500;
const height = 500;
const {
draw_flipped_text,
draw_arc,
draw_dot,
draw_line,
draw_ticks,
draw_arrow,
} = canvas_tools;
const canvas_renderer = (canvas) => {
const ctx = canvas.getContext('2d');
// re-center and orient y-axis upward
ctx.translate(width/2, height/2);
ctx.scale(1, -1); // flip so that y increases up
ctx.fillStyle = 'aliceblue';
ctx.fillRect(0, 0, 150, 150);
const text = 'This is it!';
const tx = 40;
const ty = 40;
ctx.fillStyle = 'green';
draw_flipped_text(ctx, text, tx, ty, {
clear: 'yellow',
angle: Math.PI/3,
padding: 15,
dxr: 2,
dyr: 2,
});
ctx.strokeStyle = 'red';
draw_dot(ctx, tx, ty);
ctx.strokeStyle = 'orange';
const r = 2/5*Math.min(width, height);
draw_arc(ctx, 0, 0, r, {
a0: 9/8*Math.PI,
a1: -1/8*Math.PI,
counterclockwise: true,
no_close_path: true,
no_fill: true,
});
draw_line(ctx, -200, 120, 200, 120);
const x_axis_x0 = -Math.floor(9/10*width/2);
const x_axis_y0 = 0;
const x_axis_x1 = Math.floor(9/10*width/2);
const x_axis_y1 = 0;
const y_axis_x0 = 0;
const y_axis_y0 = -Math.floor(9/10*height/2);
const y_axis_x1 = 0;
const y_axis_y1 = Math.floor(9/10*height/2);
ctx.strokeStyle = 'black';
draw_dot(ctx, 0, 0);
draw_flipped_text(ctx, "O", 0, 0, {
dxr: 1,
dyr: 1,
});
draw_line(ctx, x_axis_x0, x_axis_y0, x_axis_x1, x_axis_y1);
draw_line(ctx, y_axis_x0, y_axis_y0, y_axis_x1, y_axis_y1);
ctx.strokeStyle = 'red';
draw_ticks(ctx, 0, 0, x_axis_x1, x_axis_y1, 10, true);
draw_dot(ctx, 200, 0);
};
const canvas = ocx.create_child({
tag: 'canvas',
attrs: { width, height },
});
await canvas_renderer(canvas);
const width = 300;
const height = 300;
const canvas_renderer = (canvas) => {
const ctx = canvas.getContext('2d');
ctx.strokeStyle = 'orange';
ctx.fillStyle = 'yellow';
// adapted from https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D#basic_example
ctx.lineWidth = 10;
// door
ctx.fillRect(130, 190, 40, 60);
// wall
ctx.strokeRect(75, 140, 150, 110);
// roof
ctx.beginPath();
ctx.moveTo(50, 140);
ctx.lineTo(150, 60);
ctx.lineTo(250, 140);
ctx.closePath();
ctx.stroke();
};
const canvas = ocx.create_child({
tag: 'canvas',
attrs: { width, height },
});
await canvas_renderer(canvas);
// from: https://plotly.com/javascript/box-plots/ "Rainbow Box Plot"
function linspace(a,b,n) {
return d3.range(n).map(function(i){return a+i*(b-a)/(n-1);});
}
const boxNumber = 30;
const boxColor = [];
const allColors = linspace(0, 360, boxNumber);
const data = [];
const yValues = [];
// colors
for( let i = 0; i < boxNumber; i++ ){
const result = 'hsl('+ allColors[i] +',50%'+',50%)';
boxColor.push(result);
}
function getRandomArbitrary(min, max) {
return Math.random() * (max - min) + min;
};
// create y Values
for( let i = 0; i < boxNumber; i++ ){
const ySingleArray = [];
for( let j = 0; j < 10; j++ ){
const randomNum = getRandomArbitrary(0, 1);
const yIndValue = 3.5*Math.sin(Math.PI * i/boxNumber) + i/boxNumber+(1.5+0.5*Math.cos(Math.PI*i/boxNumber))*randomNum;
ySingleArray.push(yIndValue);
}
yValues.push(ySingleArray);
}
// create traces
for( let i = 0; i < boxNumber; i++ ){
const result = {
y: yValues[i],
type:'box',
marker:{
color: boxColor[i]
}
};
data.push(result);
};
// format the layout
const layout = {
xaxis: {
showgrid: false,
zeroline: false,
tickangle: 60,
showticklabels: false
},
yaxis: {
zeroline: false,
gridcolor: 'white'
},
paper_bgcolor: 'rgb(233,233,233)',
plot_bgcolor: 'rgb(233,233,233)',
showlegend:false
};
await plotly({ data, layout });
const width = 400;
const height = 200;
const hand_width = 450;
const hand_height = 450;
const line_width = 1;
const stroke_style = 'grey';
const fill_style = 'grey';
const canvas = ocx.create_child({
tag: 'canvas',
attrs: { width, height },
});
const ctx = canvas.getContext('2d');
ctx.scale(width/2/hand_width, height/hand_height);
ctx.lineWidth = line_width;
ctx.strokeStyle = stroke_style;
ctx.fillStyle = fill_style;
// The following is taken from "Hand2011.svg", available from
// https://freesvg.org/hand-silhouette . It is the sequence of
// drawing commands from the "d" attribute of the SVG path element.
// Note: the initial "m" command's x-coordinate was decreased by 100....
const hand_drawing_commands = "m162.25 40.219c-2.9105-0.05559-6.0974 0.25091-8.3438 0.875-2.0649 0.57368-4.6658 2.2896-6.8438 4.4688-2.1779 2.1792-3.9493 4.8177-4.5938 6.9688-0.61177 2.0419-0.86739 2.8106-0.5 5.0625s1.4405 5.9435 3.5938 13.25c1.0549 3.5796 2.6797 9.1858 3.5938 12.5 0.88843 3.2213 2.5303 7.5066 3.5 9.1875 1.1685 2.0255 2.4353 5.3663 2.9375 7.7812 8.7606 42.13 10.73 53.435 12.031 69.219 0.60645 7.3584 1.495 15.066 2.4062 21.219 0.45565 3.0763 0.91914 5.7828 1.3438 7.8438 0.42461 2.0609 0.88016 3.5655 1.0625 3.9062 1.4269 2.6663 1.3936 6.0962 0.625 8.6875-0.38428 1.2957-0.93698 2.4127-1.8438 3.125-0.45338 0.35616-1.034 0.57725-1.6562 0.5625-0.62222-0.0147-1.2036-0.25999-1.7188-0.6875-0.62549-0.51911-1.1046-1.2975-1.625-2.25-0.5204-0.95252-1.017-2.0501-1.4062-3.1562-0.68705-1.9526-3.3657-8.0127-5.8438-13.219-2.4876-5.226-5.3663-11.297-6.4062-13.5-2.6507-5.6148-6.0665-10.963-8.8438-14-1.4802-1.6184-3.6574-4.6675-5.5312-7.5-0.93692-1.4163-1.7798-2.7808-2.4062-3.875-0.31321-0.54713-0.59123-1.0307-0.78125-1.4375-0.1808-0.38707-0.32848-0.6035-0.34375-1.125-0.0313-0.0884-0.10883-0.22705-0.1875-0.40625-0.15733-0.3584-0.39125-0.84912-0.6875-1.4375-0.5925-1.1768-1.4155-2.7163-2.3125-4.3125-1.8402-3.2746-4.1444-8.1575-5.2188-11-2.0116-5.3226-6.8911-15.616-11.625-24.906-2.367-4.6449-4.7074-9.0536-6.625-12.469-0.95879-1.7076-1.8006-3.1659-2.5-4.2812-0.69944-1.1154-1.3039-1.9252-1.5312-2.1562-4.7761-4.8533-11.314-4.5008-16.625-1.0938-5.3111 3.4071-9.1641 9.8948-8.1562 17.281 1.0597 7.7662 5.666 19.84 14.281 37.062 8.1758 16.344 16.963 36.635 20.062 46.406 0.94037 2.9644 2.6562 7.2815 3.7188 9.375 1.1786 2.3221 3.263 7.5994 4.75 11.938 1.4418 4.2061 4.8654 12.1 7.5312 17.375 3.1316 6.1971 4.9642 10.456 5.8125 14.062 0.84825 3.6066 0.6564 6.5499-0.3125 9.8125-0.82164 2.7668-2.0829 5.3646-3.4375 7.3125-0.67728 0.97396-1.366 1.7679-2.0938 2.375-0.72777 0.60706-1.5074 1.0625-2.4062 1.0625-0.50082 0-0.6625-0.14744-0.9375-0.28125s-0.57754-0.31107-0.9375-0.53125c-0.71991-0.44037-1.6203-1.0542-2.6875-1.8125-2.1344-1.5166-4.8759-3.5829-7.7188-5.875-5.6306-4.5397-13.503-10.373-17.344-12.906-11.955-7.8853-18.352-13.365-25.781-21.906-4.2056-4.8352-9.3115-9.8653-14.094-14.031-4.7823-4.1659-9.2915-7.4721-12.125-8.8438-8.5138-4.1214-18.432-0.92562-22.031 7-2.0541 4.5231-2.2667 8.5462-0.0312 13.906 2.2355 5.36 7.0237 11.99 14.969 21.219 1.75 2.0329 8.0382 8.1207 15.25 14.812 7.2118 6.6918 15.428 14.083 21.188 19 3.8685 3.3025 10.045 8.8216 13.781 12.281 3.6813 3.409 8.607 7.3741 10.688 8.6875 2.4047 1.518 4.9745 4.0184 6.0625 6.0312 0.82022 1.5174 3.4003 5.0825 5.5625 7.6562 2.2506 2.679 5.736 7.4574 7.8438 10.719 2.0613 3.1894 5.1297 7.6239 6.75 9.7812 1.7597 2.3429 4.6805 7.4689 6.6562 11.656 7.5159 15.929 12.059 24.348 14.812 27.656 1.734 2.0834 5.0574 6.6133 7.4688 10.219 5.8393 8.7309 13.615 17.004 32.312 34.219 2.5515 2.3492 4.699 4.5439 6.25 6.3125 0.7755 0.88428 1.395 1.6773 1.8438 2.3438 0.44875 0.66649 0.8125 1.1049 0.8125 1.9062 0 0.76937 0.44403 2.5779 0.9375 3.5 0.42921 0.80198 0.55941 1.77 0.59375 3.0312 0.0343 1.2612-0.0596 2.8187-0.28125 4.625-0.44331 3.6126-1.3764 8.3012-2.7812 13.875-0.94532 3.7505-1.656 7.8403-2.0312 11.344-0.37528 3.5034-0.37132 6.4883-0.0625 7.7188 0.18586 0.74053 0.43929 1.1949 0.625 1.375 0.18571 0.18014 0.24964 0.21048 0.53125 0.15625 0.24041-0.0463 0.17634 0.0344 0.4375-0.4375 0.26116-0.47189 0.61436-1.5116 1.0625-3.375 0.89629-3.7268 2.2083-10.736 4.5312-23.719 0.89839-5.021 1.3756-11.638 1.125-15-0.26712-3.5827-0.73019-5.712-2.3438-8.1875s-4.459-5.3074-9.5312-9.875c-13.23-11.913-25.748-25.203-31.688-33.688-3.2721-4.6743-7.225-10.276-8.7812-12.469-3.483-4.9068-5.8712-9.4012-11.219-21.094-1.936-4.233-4.4366-8.9227-6.6875-12.688-1.1255-1.8824-2.2092-3.5163-3.0938-4.75s-1.7108-2.1053-1.8438-2.1875c-0.46659-0.28836-0.57999-0.51936-0.875-0.90625s-0.64886-0.88702-1.0312-1.4688c-0.76479-1.1634-1.6692-2.655-2.5625-4.25-1.7264-3.0826-4.4512-7.0677-5.8438-8.5625-1.6028-1.7205-4.1625-4.9197-5.75-7.2812-1.4228-2.1166-4.903-5.7024-7.5312-7.6562-2.8126-2.0909-7.5316-6.1157-10.594-9-2.9945-2.8205-8.8606-7.9836-12.969-11.438-9.1939-7.7297-27.943-24.922-33.781-30.969-3.4953-3.62-7.5471-8.6206-10.906-13.281-3.3592-4.6606-6.0117-8.8171-6.75-11.281-2.2816-7.6153 3.3244-15.291 11.219-15.281 1.7402 0.002 3.7569 0.74636 6.0938 2s4.988 3.0366 7.8125 5.25c5.6489 4.4269 11.999 10.553 17.906 17.438 6.6108 7.7038 12.418 12.568 25.75 21.562 4.786 3.2291 11.387 8.113 14.781 10.938 5.071 4.2201 8.2912 6.7092 10.75 8.0938s4.1184 1.7188 6.4375 1.7188c2.6245 0 4.366-0.54629 5.9062-1.9688 1.5403-1.4225 2.8956-3.8484 4.3438-7.7188 1.815-4.851 2.365-8.9324 1.4375-14-0.92753-5.0676-3.3978-11.155-7.7188-19.75-2.3994-4.7728-4.8841-10.385-5.625-12.781-0.64412-2.083-2.9094-7.9765-4.9688-12.906-2.0747-4.9666-4.0402-9.9977-4.5-11.594-0.7403-2.5697-4.4343-11.501-8.8125-21.438-4.3782-9.9365-9.4799-21.031-13.156-28.406-6.4701-12.979-10.029-21.893-10.875-28.469-0.42298-3.2877-0.14699-6.0261 0.875-8.3125s2.7584-4.058 5.0938-5.5c2.1653-1.337 4.1378-2.2038 6.1562-2.125 2.0184 0.07878 3.9076 1.1538 5.7812 3.1875 3.7473 4.0674 7.8341 12.137 14.375 26.375 12.706 27.659 18.364 38.37 24.531 46.531 5.2818 6.989 10.303 16.401 20.062 37.469 1.1995 2.5892 2.48 5.0812 3.5625 7 0.54124 0.95939 1.0372 1.7756 1.4375 2.375 0.40028 0.5994 0.78048 0.99176 0.75 0.96875 1.1602 0.87584 2.3946 1.1767 3.75 0.9375 1.3554-0.23924 2.8411-1.0598 4.2812-2.5 1.1968-1.1968 1.8299-1.9892 2.1875-2.9688 0.3576-0.97959 0.46875-2.2474 0.46875-4.375 0-2.6627-0.64149-7.7747-1.4062-11.094-2.2317-9.6856-4.6187-25.99-4.625-32.125-0.005-4.7769-0.70658-9.477-5.4688-36.625-1.5798-9.0061-3.4374-18.037-5.2188-25.375-1.7813-7.3375-3.5411-13.093-4.5938-15.188-1.3663-2.7187-3.1469-7.8124-4.0938-11.625-0.9177-3.6954-2.3267-8.6385-3.0938-10.812-0.85937-2.4357-1.5-6.294-1.5-8.9375 0-1.9867 0.14494-3.4352 0.78125-4.8125s1.6747-2.581 3.375-4.2812c1.7485-1.7485 2.951-2.8123 4.375-3.4375 1.424-0.62523 2.9277-0.71875 5.1562-0.71875 2.0818 0 3.5275 0.12212 4.8125 0.59375 1.285 0.47164 2.2928 1.2818 3.4062 2.4688 3.7094 3.9544 7.6163 12.013 8.9375 18.281 0.5664 2.6873 1.9813 8.7412 3.125 13.406 1.1504 4.6925 2.6606 11.455 3.375 15.062 0.67995 3.4335 2.6847 9.4097 4.375 13 0.8788 1.8666 1.6921 3.7133 2.2812 5.1875 0.29457 0.73708 0.51439 1.3806 0.6875 1.9062 0.17311 0.52561 0.3125 0.82647 0.3125 1.3438 0-0.0391 0.028 0.28304 0.125 0.6875s0.2553 0.96088 0.4375 1.5625c0.36439 1.2032 0.87302 2.7009 1.4375 4.1875 3.5289 9.2938 5.0494 15.267 6.0625 24.188 1.8281 16.098 2.6051 21.459 4.3125 29.406 1.1169 5.1986 2.4959 10.625 3.75 14.906 0.62704 2.1408 1.2382 4.001 1.75 5.4062 0.51179 1.4053 1.04 2.4268 1.125 2.5312-0.0505-0.062 0.0891 0.0958 0.4375 0.21875 0.34844 0.12299 0.88953 0.24267 1.5312 0.34375 1.2834 0.20216 3.0592 0.3125 5.1875 0.3125 2.9277 0 4.6891-0.091 5.8438-0.375 1.1547-0.28399 1.7398-0.70853 2.6562-1.625 1.0463-1.0463 1.4167-1.4179 1.7812-4.0938 0.36455-2.6759 0.55021-7.4565 0.84375-16.469 0.17017-5.2246 0.44183-10.444 0.75-14.625 0.30817-4.1813 0.60792-7.1941 0.96875-8.5625 0.0815-0.30906 0.29238-2.1314 0.4375-4.7812 0.14512-2.6499 0.28149-6.2634 0.40625-10.688 0.24952-8.8482 0.44294-20.93 0.5625-35.062 0.21417-25.317 0.25386-37.341 0.96875-43.969 0.71489-6.6276 2.3387-8.0517 5.1562-11.156 1.5303-1.6862 3.8259-2.5287 6.4375-2.5625 2.6116-0.03379 5.5926 0.70068 8.8125 2.125 4.7422 2.0977 7.8643 5.3797 9.75 12.188 1.8857 6.8078 2.7425 17.198 3.4375 34.125 0.27074 6.5944 0.57998 13.012 0.875 18.062 0.29502 5.0505 0.60822 8.8337 0.75 9.7188 0.11813 0.73742 0.16297 2.2519 0.25 4.6875 0.087 2.4356 0.17125 5.6765 0.25 9.5312 0.15749 7.7095 0.30164 17.821 0.375 28.438 0.15029 21.75 0.37331 33.814 1.3125 42.031 0.93919 8.2174 2.5577 12.554 5.625 19.125 5.2127 11.168 13.02 21.157 21.531 27.562 9.0193 6.7881 14.049 8.972 23.688 10.312 6.498 0.90378 10.752 1.273 13.938 1 3.186-0.27301 5.3398-1.1344 7.9062-2.7812 2.1189-1.3597 3.2376-2.2275 4.5938-4.25 1.3561-2.0225 2.9061-5.2291 5.5938-11.062 7.1181-15.45 10.662-21.667 15.531-27.031 1.9386-2.1357 5.0963-6.1844 6.9062-8.875 6.3861-9.4936 15.31-17.821 24.75-23.062 4.9884-2.7702 11.826-2.416 17.281 0.78125 3.5594 2.0859 5.8357 4.31 6.5938 6.9375 0.75808 2.6275-0.13109 5.4196-2.3125 8.3125-3.7581 4.984-16.055 26.999-17.875 31.938-2.1302 5.7792-6.8396 13.852-10.406 17.812-0.80844 0.89761-2.1999 2.9957-3.7188 5.625s-3.2014 5.8364-4.8438 9.125c-3.2847 6.5772-6.3419 13.571-7.1562 16.75-0.95524 3.7287-4.4348 12.227-7.8438 19.25-3.3839 6.9711-6.9744 14.491-7.9062 16.594-0.98173 2.2158-3.0815 6.4248-4.6875 9.4688-1.5877 3.0092-4.5524 8.8532-6.5938 12.969-6.5646 13.235-11.919 21.367-18.188 27.5-3.2066 3.1373-7.1451 6.4462-10.844 9.1875-3.6986 2.7413-7.0952 4.9026-9.4062 5.7812-1.0468 0.39797-2.8643 1.9032-3.5625 2.9688-0.70489 1.0758-1.8605 4.0113-2.875 7.4375s-1.9457 7.3938-2.5 10.844c-0.41058 2.5554-1.6736 8.3967-2.8125 13.094-1.7903 7.3834-4.2569 33.824-4.2188 45.875 0.007 2.3123 0.5536 4.2223 1.0938 5.0625 0.27008 0.42009 0.49454 0.47336 0.4375 0.46875-0.057-0.005 0.00072 0.0757 0.28125-0.375-0.0684 0.10981 0.003-0.055 0.0625-0.28125 0.06-0.22626 0.14389-0.53977 0.21875-0.9375 0.14973-0.79546 0.32586-1.8878 0.5-3.1875 0.34828-2.5995 0.71402-6.0409 1.0625-9.7188 0.69695-7.3557 1.2809-15.696 1.3125-20.281 0.0286-4.1516 1.0683-10.298 2.5938-15.562 0.6805-2.3483 1.3025-4.8268 1.75-6.9062 0.44747-2.0794 0.71875-3.8337 0.71875-4.4375 0-1.9304 0.67382-4.8731 1.5625-7 0.77923-1.865 1.4375-4.5685 1.4375-5.4375 0-1.8119 0.96057-3.7027 2.25-5.375s2.9047-3.1316 4.6875-3.6875c2.8902-0.90128 8.858-5.0992 14.469-10.062 5.6107-4.9633 11.062-10.749 13.438-14.656 2.8045-4.6136 7.1355-12.445 10.75-19.281 1.8073-3.4181 3.42-6.5747 4.5938-8.9688 0.58685-1.197 1.0557-2.2062 1.375-2.9375 0.15965-0.36565 0.3008-0.66897 0.375-0.875s0.0625-0.41393 0.0625-0.15625c0-0.65575 0.2447-1.2048 0.5625-1.75 0.3178-0.54518 0.74399-1.08 1.25-1.5 0.16771-0.13919 0.67934-0.79821 1.125-1.625s0.8886-1.8417 1.1875-2.7812c0.36703-1.1537 1.3761-3.5948 2.8125-6.8125s3.2616-7.1405 5.125-11c1.8499-3.8315 3.616-7.7466 4.9375-10.969 1.3215-3.2221 2.1978-5.8927 2.3125-6.6562 0.22056-1.4679 1.0686-3.7134 2.2812-6.5625 1.2127-2.8491 2.7947-6.2184 4.4688-9.5625s3.4402-6.6536 5.0312-9.4062 2.9606-4.9216 4.0312-6.0938c4.1441-4.537 7.374-10.064 10.344-17.875 1.5343-4.0358 3.7657-8.7634 5.1562-10.812 1.1851-1.7464 3.9128-6.5251 5.9688-10.438 2.1103-4.016 5.4414-9.1213 7.5938-11.594 2.4603-2.8261 3.658-4.4545 4.0312-5.9062 0.37322-1.4518 0.049-3.0109-0.90625-5.9688-1.3851-4.2887-2.1235-5.1503-6.75-8.2188-2.6469-1.7557-3.9451-2.5893-5.5938-3-1.6486-0.41069-3.8304-0.42912-8.0625-0.375-3.5354 0.0452-5.8428 0.18599-7.5312 0.5-1.6885 0.31401-2.756 0.7751-4.0312 1.5938-1.8485 1.1866-4.672 2.9304-6.3438 3.9062-2.2203 1.296-6.291 4.9957-10.938 9.9688-4.6465 4.973-9.9549 11.22-14.938 17.75-1.1828 1.5501-3.8777 6.3215-6.8438 12.031-2.966 5.7097-6.2628 12.444-8.8438 18.219-3.2294 7.2252-4.8926 9.553-8.7188 12.25l-4.5 3.1562a0.99976 0.99976 0 0 1 -0.6875 0.1875l-9.4062-1.0938c-9.9748-1.1764-17.029-3.9411-23.469-9.1875-1.7564-1.431-4.59-3.7024-6.2812-5-1.0221-0.7842-2.384-2.2274-3.9688-4.0625-1.5848-1.8352-3.368-4.0415-5.0312-6.2188-1.6632-2.1772-3.2248-4.316-4.375-6.0625-0.57512-0.87327-1.0308-1.6401-1.375-2.2812-0.34423-0.64118-0.625-1.0084-0.625-1.75 0 0.13105-0.0324-0.17495-0.15625-0.53125s-0.32546-0.83674-0.5625-1.375c-0.47408-1.0765-1.1236-2.4258-1.8438-3.75-1.5432-2.8377-3.1305-7.2777-3.625-10.219-2.0507-12.198-2.9528-34.497-2.375-57.188 0.3722-14.616 0.16407-26.984-0.4375-31.344-0.59228-4.2925-1.4268-18.153-1.9375-31.094-0.64424-16.325-1.6858-27.157-3.5-34.125-1.8142-6.9684-4.234-9.9212-7.8125-11.094-2.0453-0.67019-4.5128-1.7197-5.7812-2.5-0.76339-0.4696-3.6396-1.361-5.8438-1.6875-6.1968-0.91782-10.667 1.2636-14.469 7.1875l-3.0938 4.8438-0.1875 46.281c-0.056 14.711-0.19208 26.715-0.40625 35.375-0.10709 4.3302-0.23388 7.8286-0.375 10.406-0.14112 2.5776-0.25828 4.1306-0.5 5.0312-0.29041 1.0821-0.66328 3.7083-1 6.9688-0.33672 3.2604-0.64941 7.2077-0.90625 11.188-0.51368 7.9596-0.76172 16.145-0.46875 18.781 0.30506 2.7452-0.11074 5.0766-1.3125 6.75s-3.1875 2.5625-5.5625 2.5625c-2.0492 0-3.8566-0.87514-5.1562-2.9375-1.2997-2.0624-2.3342-5.2432-3.6875-10.312-3.1866-11.937-5.2357-24.312-6.8438-41.156-0.69041-7.232-3.6086-18.644-6.5625-25.719-0.71778-1.7191-2.0607-5.5144-3.0625-8.5625-0.9688-2.9476-2.6498-6.6826-3.5-7.9062-1.1811-1.7-2.0312-4.2516-2.0312-6.25 0-1.4654-0.50785-4.1266-1.0312-5.5-0.67792-1.7788-1.9844-6.9601-3.0625-11.938-1.0724-4.9512-2.371-10.992-2.9062-13.406-0.96898-4.3717-2.9074-9.1334-5.125-13.062-2.2176-3.9291-4.8086-7.0226-6.7188-8.0938-0.93273-0.52302-3.6479-1.0068-6.5625-1.0625z";
canvas_tools.svg_path_interpreter(ctx, hand_drawing_commands);
ctx.stroke();
ctx.fill();