HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/paper.js/0.9.25/paper-full.js"></script>
<script type="text/paperscript" canvas="myCanvas">
myData = 'M-9.3590822,119.086998L56.637619,21.5918713l43.4978256,95.9952011L161.63237,33.5912704l34.4982758,94.4952774l68.9965515-139.4930267l70.49646,155.9922028l58.4971008-122.9938507l28.4985657,101.9948959l31.4984131-46.497673l31.4984436,37.4981232l43.4978333-29.998497l25.4987183,31.4984207L599.6104736,60.58992l61.4969482,61.4969254L719.6044922,8.0925455l32.9983521,115.4942245c0,0,50.9974365-52.4973755,55.4971924-52.4973755s68.996582,73.4963303,68.996582,73.4963303L932.593811,27.5915699l109.4945679,88.495575l56.9970703-149.9924927l154.4923096,163.4918213l67.496582-83.9958038l74.9963379,68.9965515l136.4931641-131.9933929L1579.0615234,100l56.9970703-67.9086533l23.9989014,46.497673l40.4979248-49.4975243L1781.5513916,100l62.9968262-52.9094048l49.4975586,58.4970741l37.4980469-112.4943771l53.9973145,97.4951248l35.998291-68.9965439';
var path = new Path(myData);
path.strokeColor = '#000';
path.strokeWidth = 5;
//linePath.fullySelected = true;
</script>
<canvas id="myCanvas" resize></canvas>
CSS
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
body {
line-height: 1;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
html,
body {
height: 100%;
}
/*********
STYLES
*********/
canvas {
width: 100%;
height: 100%
}