## Swirly graphics

Just did a small 10 minute experiment in Smart Pascal. Essentially what I want is to be able to pre-calculate a nice soft path between X number of points. Which is essentially what is known as a bezier curve. This can be used in many situations from plotting pixels, moving sprites or indeed – animating elements with CSS.

Here is my 10 minute experiment:

```function bezier(p1,p2,p3,p4:TPoint;t:float):TPoint;
begin
var mum1 := 1- t;
var mum13 := mum1 * mum1 * mum1;
var mu3 := t * t * t;

result:=TPoint.Create(
round(mum13 * p1.x + 3*t * mum1*mum1 * p2.x+3*t*t * mum1*p3.x + mu3*p4.x),
round(mum13 * p1.y + 3*t * mum1*mum1 * p2.y+3*t*t * mum1*p3.y + mu3*p4.y) );
end;

procedure TForm1.W3Button1Click(Sender: TObject);
var
mBitmap:  TBitmap;
x:  Integer;
p1,p2,p3,p4:  TPoint;
begin
mBitmap:=TBitmap.create;
try
mBitmap.Allocate(400,400);

p1:=TPoint.Create(10,60);
p2:=Tpoint.create(100,40);
p3:=Tpoint.create(180,60);
p4:=Tpoint.create(200,180);

mBitmap.canvas.pen.color:=clRed;
mBitmap.canvas.MoveTo(p1);
mBitmap.canvas.lineTo(p2);
mBitmap.canvas.lineto(p3);
mBitmap.Canvas.lineto(p4);

var f :=0.0;
for x:=0 to 100 do
begin
f:=x / 100;
var mpt := bezier(p1,p2,p3,p4,f);
writeln(mpt.toString());
mBitmap.canvas.Pixels[mpt.x,mpt.y]:=clBlue;
end;

w3panel1.Background.FromURL(mBitmap.Canvas.ToDataURL('png'));

finally
mBitmap.free;
end;
end;
```

Lo and behold the mighty swirley path!