连接相邻的矩形?

时间:2016-05-01 12:02:23

标签: javascript html arrays algorithm canvas

我想连接Array中的Rectangle-Objects,它们并排(相邻)。例如:(结构:“{x:x-Postion,y:y-Postion,x1:width,y1:height}”)

{x: 0, y: 0, x1: 3, y1: 2}, {x: 0, y: 2, x1: 3, y1: 2}

可以放在一起(如我所愿):

{x: 0, y: 0, x1: 3, y1: 4}

直到现在我找不到解决问题的方法,所以我希望你能帮助我。这是我的数组的一部分,我想并排找到这些 - 矩形并将它们保存在一个新数组中:

[{x:0, y: 0, x1:3, y1:2},{x:0, y: 2, x1:3, y1:2},{x:0, y: 4, x1:3, y1:2},{x:0, y: 6, x1:3, y1:2},{x:0, y: 8, x1:3, y1:2},{x:0, y: 10, x1:3, y1:2},{x:0, y: 12, x1:3, y1:2},{x:0, y: 14, x1:3, y1:2},{x:0, y: 16, x1:3, y1:2},{x:0, y: 18, x1:3, y1:2},{x:0, y: 20, x1:3, y1:2},{x:0, y: 22, x1:3, y1:2},{x:0, y: 24, x1:3, y1:2},{x:0, y: 26, x1:3, y1:2},{x:0, y: 28, x1:3, y1:2},{x:0, y: 30, x1:3, y1:2}//[...]so on

2 个答案:

答案 0 :(得分:0)

O(n ^ 2)解决方案就是这样:

foreach rect as rect1:
  foreach rect as rect2:
    // rect1 above rect2
    if rect1.x == rect2.x && rect1.x1 + rect1.x == rect2.x1 + rect2.x && rect1.y1 + rect1.y == rect2.y:
      outrect = {rect1.x, rect1.x1, rect1.y, rect2.y1+rect1.y1}
      array.remove(rect1,rect2)
      array.add(outrect)
    // rect1 below rect2
    else if rect1.x == rect2.x && rect1.x1 + rect1.x == rect2.x1 + rect2.x && rect1.y == rect2.y1 + rect2.y:
      outrect = {rect1.x, rect1.x1 + rect1.x, rect2.y, rect2.y1+rect1.y1}
      array.remove(rect1,rect2)
      array.add(outrect)
    // rect1 at right of rect2
    else if rect1.y == rect2.y && rect1.y1 + rect1.y == rect2.y1 + rect2.y && rect1.x == rect2.x1 + rect2.x:
      outrect = {rect2.x, rect1.x1 + rect2.x1, rect1.y, rect1.y1}
      array.remove(rect1,rect2)
      array.add(outrect)
    // rect1 at left of rect2
    else if rect1.y == rect2.y && rect1.y1 + rect1.y == rect2.y1 + rect2.y && rect2.x == rect1.x1 + rect1.x:
      outrect = {rect1.x, rect1.x1 + rect2.x1, rect1.y, rect1.y1}
      array.remove(rect1,rect2)
      array.add(outrect)

(顺便说一句,这只是伪代码)

答案 1 :(得分:0)

这应该这样做。一开始我无法识别出矩形堆叠在一起。我不得不考虑所有条件。我相信它会在矩形放置的任何地方递归搜索和合并,如果它们的触摸边缘大小相同。

var rects = [{x:0, y: 0, x1:3, y1:2},{x:0, y: 2, x1:3, y1:2},{x:0, y: 4, x1:3, y1:2},{x:0, y: 6, x1:3, y1:2},{x:0, y: 8, x1:3, y1:2},{x:0, y: 10, x1:3, y1:2},{x:0, y: 12, x1:3, y1:2},{x:0, y: 14, x1:3, y1:2},{x:0, y: 16, x1:3, y1:2},{x:0, y: 18, x1:3, y1:2},{x:0, y: 20, x1:3, y1:2},{x:0, y: 22, x1:3, y1:2},{x:0, y: 24, x1:3, y1:2},{x:0, y: 26, x1:3, y1:2},{x:0, y: 28, x1:3, y1:2},{x:0, y: 30, x1:3, y1:2}];

function rectsReduce(arr){

  function mergeRects(r,sa,a,i){
  	
    function compare(r1,r2){
      return r1.y == r2.y ? r1.x >  r2.x ? r1.x - r2.x == r2.x1
                                         : r2.x - r1.x == r1.x1
                          : r1.x == r2.x ? r1.y > r2.y ? r1.y - r2.y == r2.y1
                                                       : r2.y - r1.y == r1.y1
                                         : false;
    }
  	
    var fi = sa.findIndex(e => compare(r,e))+i+1,
    r2 = ~fi ? a.splice(fi,1)[0] : void 0;
	return !!r2 && { x : Math.min(r.x, r2.x),
	                 y : Math.min(r.y, r2.y),
	                x1 : r.x == r2.x ? r.x1 : r.x1 + r2.x1,
	                y1 : r.y == r2.y ? r.y1 : r.y1 + r2.y1};
  }
	
  return arr.reduce((p,c,i,a) => { var mergedRect = {};
                                   a.length > 1 && (mergedRect = mergeRects(c,p.slice(i+1),a,i),
                                                    !!mergedRect && (p[i] = mergedRect,
                                                    p = rectsReduce(p)));
	                           return p},arr);	
}

document.write("<pre>" + JSON.stringify(rectsReduce(rects)) + "</pre>");