kineticjs - Create convex hull around points with JavaScript - Stack Overflow

admin管理员组

文章数量:1334198

I want to create a hull around images created with KineticJS.

1 - I save all vertices of the images in an array with [x,y]:

var points = [[0, 0], [0,350], [170, 0], [170, 300], [135, 135] , [135, 435], [305, 135], [305, 435]];

2 - I want to create a convex hull around the points

3 - after, I want to set the distance of the hull a little bit higher, so all objects can be in the hull.

I found a javascript implementation for creating a convex hull online and tried to bind this in my KineticJS Script.

But I get an error: Uncaught RangeError: Maximum call stack size exceeded in the buildConvexHull function:

allBaseLines.push(baseLine)

My code is in a fiddle but it doesn't work... /

I want to create a hull around images created with KineticJS.

1 - I save all vertices of the images in an array with [x,y]:

var points = [[0, 0], [0,350], [170, 0], [170, 300], [135, 135] , [135, 435], [305, 135], [305, 435]];

2 - I want to create a convex hull around the points

3 - after, I want to set the distance of the hull a little bit higher, so all objects can be in the hull.

I found a javascript implementation for creating a convex hull online and tried to bind this in my KineticJS Script.

But I get an error: Uncaught RangeError: Maximum call stack size exceeded in the buildConvexHull function:

allBaseLines.push(baseLine)

My code is in a fiddle but it doesn't work... http://jsfiddle/gvFrd/5/

• javascript
• kineticjs
• convex-hull

Share Improve this question Follow edited Mar 1, 2014 at 22:09 sumisu asked Mar 1, 2014 at 21:32 sumisusumisu 13511 gold badge44 silver badges1212 bronze badges 4

• It may be that the convex hull algorithm expects a list of pairs in points. You have first the list of x and then the list of y coordinates. – Lutz Lehmann Commented Mar 1, 2014 at 21:46
• I changed the structure to var points = [[0, 0], [0,350], [170, 0], [170, 300], [135, 135] , [135, 435], [305, 135], [305, 435]]; But the error doesn't disappear. – sumisu Commented Mar 1, 2014 at 21:51
• The for loop seems strange. Try to bine both lines, for( var pt in points). But then maybe I do not know enough about JS. – Lutz Lehmann Commented Mar 1, 2014 at 21:57
• Thanks, that was not the fault, but so I recognized that I'm too stupid for copy and paste...The function was the same as getConvexHull... I updated all, but the error is that the baseline is not defined... – sumisu Commented Mar 1, 2014 at 22:08

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

Hull.js looks like the answer you are looking for. After making a convex hull it can also push the edges inward and generate more segments to get what looks like a pretty accurate outline.

https://www.npmjs./package/hull.js

A simple algorithm is to divide the set of points into 2 half sets and find the 3 farthest points and triangulate the points. Each point inside the triangle is then in the convex hull. Then repeat the steps for the other points. Search for the quick hull algorithm. You can also use a delaunay triangulation. You can download my convex hull class @ phpclasses. It uses a delaunay triangulation.

本文标签： kineticjsCreate convex hull around points with JavaScriptStack Overflow