scratchfoundation/paper.js
1
0
Fork 0
mirror of https://github.com/scratchfoundation/paper.js.git synced 2025-06-14 22:20:52 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Optimize Tadpoles example.

Browse source 
- Shape instead Symbol
- Directly modify segments instead of copying points
This commit is contained in:
Jürg Lehni 2013-12-08 10:58:19 +01:00
parent 61f2f5c978
commit e269ba7cc6
1 changed files with 31 additions and 28 deletions

59
examples/Paperjs.org/Tadpoles.html
View file

@ -18,10 +18,7 @@
this.radius = 30;
this.maxSpeed = maxSpeed + strength;
this.maxForce = maxForce + strength;
this.points = [];
for (var i = 0, l = strength * 10 + 10; i < l; i++) {
this.points.push(new Point());
}
this.amount = strength * 10 + 10;
this.count = 0;
this.lastAngle = 0;
this.distances = [];
@ -42,47 +39,53 @@
},
calculateTail: function() {
var points = this.points;
var segments = this.path.segments,
shortSegments = this.shortPath.segments;
var speed = this.vector.length;
var pieceLength = 5 + speed * 0.3;
var point = points[0] = this.position.clone();
var lastVector = this.vector.clone();
for (var i = 1, l = points.length; i < l; i++) {
var point = this.position.clone();
segments[0].point = shortSegments[0].point = point;
// Chain goes the other way than the movement
var lastVector = -this.vector;
for (var i = 1; i < this.amount; i++) {
var vector = segments[i].point - point;
var sideways = lastVector.rotate(90);
this.count += speed * 15;
var vector = point - points[i];
var rotated = lastVector.rotate(90);
rotated.length = Math.sin((this.count + i * 3) * 0.003);
lastVector.length = -pieceLength;
point += lastVector;
points[i] = point + rotated;
sideways.length = Math.sin((this.count + i * 3) * 0.003);
lastVector.length = pieceLength;
point += lastVector + sideways;
segments[i].point = point;
if (i < 3)
shortSegments[i].point = point;
lastVector = vector;
}
},
createItems: function() {
this.head = (project.symbols[0]
? project.symbols[0]
: new Symbol(new Path.Ellipse({
from: [0, 0],
to: [13, 8],
fillColor: 'white'
}))).place();
this.head = new Shape.Ellipse({
center: [0, 0],
size: [13, 8],
fillColor: 'white'
});
this.path = new Path({
strokeColor: 'white',
strokeWidth: 2,
strokeCap: 'round'
});
for (var i = 0; i < this.amount; i++)
this.path.add(new Point());
this.shortPath = new Path({
strokeColor: 'white',
strokeWidth: 4,
strokeCap: 'round'
});
for (var i = 0; i < Math.min(3, this.amount); i++)
this.shortPath.add(new Point());
},
updateItems: function() {
this.path.segments = this.points;
this.shortPath.segments = this.points.slice(0, 3);
this.head.position = this.position;
var angle = this.vector.angle;
this.head.rotate(angle - this.lastAngle);
@ -134,9 +137,9 @@
if (position.y > size.height + radius) vector.y = -size.height -radius;
if (!vector.isZero()) {
this.position += vector;
var points = this.points;
for (var i = 0, l = points.length; i < l; i++) {
points[i] += vector;
var segments = this.path.segments;
for (var i = 0; i < this.amount; i++) {
segments[i].point += vector;
}
}
},
@ -236,7 +239,7 @@
}
});
var heartPath = project.importJSON('["Path",{"pathData":"M514.69629,624.70313c-7.10205,-27.02441 -17.2373,-52.39453 -30.40576,-76.10059c-13.17383,-23.70703 -38.65137,-60.52246 -76.44434,-110.45801c-27.71631,-36.64355 -44.78174,-59.89355 -51.19189,-69.74414c-10.5376,-16.02979 -18.15527,-30.74951 -22.84717,-44.14893c-4.69727,-13.39893 -7.04297,-26.97021 -7.04297,-40.71289c0,-25.42432 8.47119,-46.72559 25.42383,-63.90381c16.94775,-17.17871 37.90527,-25.76758 62.87354,-25.76758c25.19287,0 47.06885,8.93262 65.62158,26.79834c13.96826,13.28662 25.30615,33.10059 34.01318,59.4375c7.55859,-25.88037 18.20898,-45.57666 31.95215,-59.09424c19.00879,-18.32178 40.99707,-27.48535 65.96484,-27.48535c24.7373,0 45.69531,8.53564 62.87305,25.5957c17.17871,17.06592 25.76855,37.39551 25.76855,60.98389c0,20.61377 -5.04102,42.08691 -15.11719,64.41895c-10.08203,22.33203 -29.54687,51.59521 -58.40723,87.78271c-37.56738,47.41211 -64.93457,86.35352 -82.11328,116.8125c-13.51758,24.0498 -23.82422,49.24902 -30.9209,75.58594z","strokeWidth":2,"strokeCap":"round"}]');
var heartPath = new Path('M514.69629,624.70313c-7.10205,-27.02441 -17.2373,-52.39453 -30.40576,-76.10059c-13.17383,-23.70703 -38.65137,-60.52246 -76.44434,-110.45801c-27.71631,-36.64355 -44.78174,-59.89355 -51.19189,-69.74414c-10.5376,-16.02979 -18.15527,-30.74951 -22.84717,-44.14893c-4.69727,-13.39893 -7.04297,-26.97021 -7.04297,-40.71289c0,-25.42432 8.47119,-46.72559 25.42383,-63.90381c16.94775,-17.17871 37.90527,-25.76758 62.87354,-25.76758c25.19287,0 47.06885,8.93262 65.62158,26.79834c13.96826,13.28662 25.30615,33.10059 34.01318,59.4375c7.55859,-25.88037 18.20898,-45.57666 31.95215,-59.09424c19.00879,-18.32178 40.99707,-27.48535 65.96484,-27.48535c24.7373,0 45.69531,8.53564 62.87305,25.5957c17.17871,17.06592 25.76855,37.39551 25.76855,60.98389c0,20.61377 -5.04102,42.08691 -15.11719,64.41895c-10.08203,22.33203 -29.54687,51.59521 -58.40723,87.78271c-37.56738,47.41211 -64.93457,86.35352 -82.11328,116.8125c-13.51758,24.0498 -23.82422,49.24902 -30.9209,75.58594z');
var pathLength = heartPath.length;
var boids = [];