How can i replicate the following example in ZIMJS?

Questions
1

paths
paths691×535 23.9 KB

2

PREMADE
You can make Squiggle() objects and record their path - for instance with ZIM Paths - Interactive Path Animations or use the Squiggle recordPath(true) in a button event so you can record when you are finished drawing.

DYNAMIC
You could have start and end points and then a bunch of random points in between then use spline() to make Squiggles - here is spline() with a Blob:

const points = spline([[10,10],[50,20],[30,200],[230,100]], 1, true);
new Blob({
   borderColor:purple,
   borderWidth:2,
   controlType:"mirror", // otherwise default is free
   points:points
}).center();

You would do that for each Squiggle.

3

The premade is an amazing tool that has been available for a while and definitely i will have to make time to learn how to use it, and specially to build a complex path. I will go with the dynamic one which is more suitable for the need and thank you so much for the support. ZIMJS is amazing. So is Dr. Abstract.

1 Like
4

If the dynamic does not give you smooth enough curves or not enough loops then another option - probably the one I would end up using would be a hybrid. Make 4 general very squiggly paths. Then randomly choose from them, flip them randomly horizontally and vertically to get extra randomness. Then rotate each point by a certain amount to make them a little different.

5

I will definitely follow your suggestion. Thank you master.