paper.js/examples/Scripts/Arcs.html

40 lines
875 B
HTML
Raw Normal View History

2011-02-21 08:31:26 -05:00
<!DOCTYPE html>
2011-02-07 13:28:09 -05:00
<html>
<head>
2013-06-02 16:41:10 -04:00
<meta charset="UTF-8">
<title>Arcs</title>
<link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper-full.js"></script>
2011-03-04 06:38:38 -05:00
<script type="text/paperscript" canvas="canvas">
2013-03-02 11:05:56 -05:00
var values = {
points: 20,
radius: 20,
initialRadius: 10
};
2011-03-04 06:38:38 -05:00
for (var i = 0; i < 30; i++) {
2013-03-02 11:05:56 -05:00
var path = new Path({
fillColor: i % 2 ? 'red' : 'black',
closed: true
});
var point = new Point({
length: values.initialRadius + values.radius * i,
angle: 0
});
for (var j = 0; j <= values.points; j++) {
point.angle += 360 / values.points;
2011-03-04 06:38:38 -05:00
if (j == 0) {
2013-03-02 11:05:56 -05:00
path.add(view.center + point);
2011-03-04 06:38:38 -05:00
} else {
2013-03-02 11:05:56 -05:00
path.arcTo(view.center + point);
2011-02-07 13:28:09 -05:00
}
}
project.activeLayer.insertChild(0, path);
2011-02-07 13:28:09 -05:00
}
</script>
</head>
<body>
<canvas id="canvas" resize></canvas>
2011-05-30 18:27:39 -04:00
</body>
</html>