summaryrefslogtreecommitdiffstats
path: root/dirty.html
diff options
context:
space:
mode:
authorSaivan <savian@me.com>2018-05-28 19:58:34 +1000
committerSaivan <savian@me.com>2018-05-28 19:58:34 +1000
commitd0beb6dfdeabb2fcd2e6b8bbad9be0c5a651d7f9 (patch)
tree894e946083d4c6158091ce64118ad1b95b6d491c /dirty.html
parentcbf1359e0ab469e1137450192b7d612501c4bb5c (diff)
downloadsvg.js-d0beb6dfdeabb2fcd2e6b8bbad9be0c5a651d7f9.tar.gz
svg.js-d0beb6dfdeabb2fcd2e6b8bbad9be0c5a651d7f9.zip
Segmenting out some Controllers
Diffstat (limited to 'dirty.html')
-rw-r--r--dirty.html60
1 files changed, 30 insertions, 30 deletions
diff --git a/dirty.html b/dirty.html
index 25ee5c3..1b8a3e3 100644
--- a/dirty.html
+++ b/dirty.html
@@ -75,39 +75,39 @@ function getColor(t) {
// }
// }
-// var randPoint = (x = 50, y = 50) => [
-// Math.random() * 100 - 50 + x,
-// Math.random() * 100 - 50 + y
-// ]
-//
-// var poly = SVG('<polygon>').plot([
-// randPoint(),
-// randPoint(),
-// randPoint(),
-// randPoint(),
-// randPoint()
-// ]).attr({fill: 'none', stroke: 'black'}).addTo('svg')
-// var polyAni = poly.animate(new SVG.PID(null, 0))
+var randPoint = (x = 50, y = 50) => [
+ Math.random() * 100 - 50 + x,
+ Math.random() * 100 - 50 + y
+]
+
+var poly = SVG('<polygon>').plot([
+ randPoint(),
+ randPoint(),
+ randPoint(),
+ randPoint(),
+ randPoint()
+]).attr({fill: 'none', stroke: 'black'}).addTo('svg')
+var polyAni = poly.animate(new SVG.Spring(300, 50))
+
+SVG.on(document, 'click', function (e) {
+ polyAni.plot([
+ randPoint(e.pageX-50, e.pageY-50),
+ randPoint(e.pageX+50, e.pageY-50),
+ randPoint(e.pageX+50, e.pageY),
+ randPoint(e.pageX+50, e.pageY+50),
+ randPoint(e.pageX-50, e.pageY+50)
+ ])
+})
+
+// var mover = SVG('<ellipse>').size(50, 50).center(100, 100).addTo('svg')
+// var anim = mover.animate(SVG.PID(null, null, null, false)).move(500, 500)
//
-// SVG.on(document, 'click', function (e) {
-// polyAni.plot([
-// randPoint(e.pageX-50, e.pageY-50),
-// randPoint(e.pageX+50, e.pageY-50),
-// randPoint(e.pageX+50, e.pageY),
-// randPoint(e.pageX+50, e.pageY+50),
-// randPoint(e.pageX-50, e.pageY+50)
-// ])
+// SVG.on(document, 'mousemove', function (e) {
+// //mover.animate(SVG.PID()).move(e.pageX, e.pageY)
+// var p = mover.point(e.pageX, e.pageY)
+// anim.center(p.x, p.y)
// })
-var mover = SVG('<ellipse>').size(50, 50).center(100, 100).addTo('svg')
-var anim = mover.animate(SVG.PID(null, null, null, false)).move(500, 500)
-
-SVG.on(document, 'mousemove', function (e) {
- //mover.animate(SVG.PID()).move(e.pageX, e.pageY)
- var p = mover.point(e.pageX, e.pageY)
- anim.center(p.x, p.y)
-})
-
</script>
</body>