Crossroads in Raphael

Question

I am trying to find out if two paths intersect in Raphael. I tried getBBox (), but it returns the coordinates of the field around the path itself. Is there an easier way to achieve this?

Answer 1

The previous answers may have been for an earlier version of Raphael. The API now includes a pathIntersection method that returns an array of intersecting points. You can simply check the length of the return value.

Answer 2

Bruteforce Method Get all the points for the two paths and see if the two points match.

I made this one for you, but maybe you should come up with a better comparative solution. Depending on how long your journeys are, this can be difficult.

var paper = Raphael(0, 0, '100%', '100%'); var path1 = paper.path("M0 0L100 100"); var path2 = paper.path("M100 0L0 100"); var array1 = new Array(); var array2 = new Array(); for(var i = 0; i < path1.getTotalLength(); i++) { array1.push(path1.getPointAtLength(i)); } for(var i = 0; i < path2.getTotalLength(); i++) { array2.push(path2.getPointAtLength(i)); } for(var i = 0; i < array1.length; i++) { for(var k = 0; k < array2.length; k++) { // the threshold +-1 is important! if(array1[i].x < ( array2[k].x + 1 ) && array1[i].x > ( array2[k].x - 1 )) { if(array1[i].y < ( array2[k].y + 1 ) && array1[i].y > ( array2[k].y - 1 )) { alert('yeah'); // uncomment this. It will alert 4 times. } } } } 

Answer 3

I think you need to implement something because Raphael does not provide this kind of functionality. Here's an example of intersecting a circle that might help. Here is something more specific .

Before running your actual algorithm, you probably want to check if the bounding rectangles intersect. If they do, check the actual paths.

Answer 4

Use this beautiful intersection library. With this you can do things like this:

 var shape1 = new Path(pathElement1), shape2 = new Path(pathElement2); var inter = Intersection.intersectShapes(shape1, shape2); if(inter.points.length > 0) { // yes they intersect! } 

The inter object in my example contains other useful materials.