计算两条路径的交叉面积 [英] Calculate intersection area of two paths

问题描述

，以防对你有用.

var p1 = "M100 100 L100 400 L400 400 L400 100 Z",p2 = "M200 200 L200 500 L500 500 L500 200 Z";var paper = new Raphael(0, 0, 800, 600);paper.path(p1).attr({fill : "red", opacity : 1});paper.path(p2).attr({fill : "blue", opacity : 0.5});var 点 = Raphael.pathIntersection(p1, p2);var w = points[1].x-points[0].x，h = 点[0].y-点[1].y;var group = paper.set();group.push(paper.rect(510, 100, w, h).attr({fill: "yellow"}));group.push(paper.text(610, 150, "交点区域\n画在此处.\n \n宽度:" + w + "\n高度:" + h));

There is only a Raphael.pathIntersection(path1, path2) utility in Raphaël library, and this method can only get intersection points of these 2 paths.

What I need is the intersection area.

As the image below, the method only get 2 points (marked with red circles). I expect to have 2 other points (marked with blue circles.) at the same time to form an intersection area path.

解决方案

The two points should be all you need. However I'm not sure why you want to intersect. Either you need to know the area (width*height) or you need to visualize the intersection. Either way it's enough to know the two points of the rectangle. I've prepared a little example in case it would be useful to you.

var p1 = "M100 100 L100 400 L400 400 L400 100 Z",
    p2 = "M200 200 L200 500 L500 500 L500 200 Z";
var paper = new Raphael(0, 0, 800, 600);

paper.path(p1).attr({fill : "red", opacity : 1});
paper.path(p2).attr({fill : "blue", opacity : 0.5});

var points = Raphael.pathIntersection(p1, p2);
var w = points[1].x-points[0].x,
    h = points[0].y-points[1].y;
var group = paper.set();
group.push(paper.rect(510, 100, w, h).attr({fill: "yellow"}));
group.push(paper.text(610, 150, "The intersection area\nis drawn over here.\n \nWidth: " + w + "\nHeight: " + h));

这篇关于计算两条路径的交叉面积的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！