Menu
I have randomly generated some points on a JavaScript canvas I was wondering what the most efficient method would be to draw triangles connecting the points in a uniform fashion. The goal is to have the triangles fill the entire canvas without overlapping.
For a visual representation, here is an image of the points I have randomly generated across a canvas. As you can see I may have to modify the way I randomly place the points on the canvas.
And this is how I wish to draw the triangles.
478
The first step is to decompose the polygon into triangles. You can use the relative areas of the triangles to determine the probability that a random point is in each triangle. Finally, you can generate random points in the union of the triangles.
randint() method. Python provides a random module to generate random numbers. To generate random numbers we have used the random function along with the use of the random. randint function.
Generate Random Point in a Circle in C++Radius and x-y position of the center of the circle is passed into the class constructor. A point on the circumference of the circle is considered to be in the circle. The randPoint() returns x-position and y-position of the random point, in that order.
Thanks to @Phorgz & @GabeRogan for pointing me in the right direction. Delaunay Triangulation was definitely the way to go and it ended up being very fast, even when updating the canvas as an animation.
I did end up using the npm package faster-delaunay which uses the divide and conquer algorithm to triangulate the randomly generated points.
Here is a result of what I have drawn on the canvas that updates as the points move around the plane:
144
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
