Javascript 根据angularjs中画布上的位置对列表项进行排序

我使用angularjs和javascript在html5画布上绘制了以下json格式的矩形。 我需要根据x，y位置对数组进行排序

{
"obj0": {
"outerRects": [
  {
    "outerRectRoi": {
      "x1": 0,
      "x2": 650,
      "x3": 350,
      "x4": 340,
      "y1": 0,
      "y2": 680,
      "y3": 0,
      "y4": 680
    },
    "line": [
      {
        "lineRoi": {
          "x1": 471,
          "x2": 460,
          "y1": 1,
          "y2": 680
        },
        "innerRect": [
          {
            "innerRoi": {
              "x1": 368,
              "x2": 390,
              "y1": 50,
              "y2": 55
            }
          },
          {
            "innerRoi": {
              "x1": 368,
              "x2": 390,
              "y1": 70,
              "y2": 74
            }
          }
        ]
      },
      {
        "lineRoi": {
          "x1": 202,
          "x2": 197,
          "y1": 1,
          "y2": 680
        }
      },
      {
        "lineRoi": {
          "x1": 380,
          "x2": 372,
          "y1": 1,
          "y2": 680
        }
      }
    ]
  },
  {}
]
},
"obj1": {}
}

以下是根据Roi或画布上的位置进行排序的条件：

a。外部矩形（外部错误）必须从左到右排序。它们可以是多行，如下所示

1  2

3  4

b。行也将在外部矩形内从左到右排序

c。innerRect将根据它们在行顶部的位置从上到下排序

这将是预期的json结果

{
"obj0": {
"outerRects": [
  {
    "outerRectRoi": {
      "x1": 0,
      "x2": 650,
      "x3": 350,
      "x4": 340,
      "y1": 0,
      "y2": 680,
      "y3": 0,
      "y4": 680
    },
    "line": [
      {
        "lineRoi": {
          "x1": 202,
          "x2": 197,
          "y1": 1,
          "y2": 680
        },
        "innerRect": []
      },
      {
        "lineRoi": {
          "x1": 380,
          "x2": 372,
          "y1": 1,
          "y2": 680
        },
        "innerRext": []
      },
      {
        "lineRoi": {
          "x1": 471,
          "x2": 460,
          "y1": 1,
          "y2": 680
        },
        "innerRect": [
          {
            "innerRoi": {
              "x1": 368,
              "x2": 390,
              "y1": 70,
              "y2": 74
            }
          },
          {
            "innerRoi": {
              "x1": 368,
              "x2": 390,
              "y1": 50,
              "y2": 55
            }
          }
        ]
      }
    ]
  },
  {}
]
},
"obj1": {}
}

如何使用angularjs和javascript实现这一点

---

谢谢

您可以迭代各种数组，并根据需要对子数组及其属性进行排序

var object={“obj0”：{“outerRects”：[{“outerRectRoi”：{“x1”：0，“x2”：650，“x3”：350，“x4”：340，“y1”：0，“y2”：680，“y3”：0，“y4”：680}”，line:[{“lineRoi”：{“x1”：471，“x2”：460，“y1”：1，“y2”：680}，“innerrectroi”：[{“innerrroi”：{“x1”：368”，“x2”：390，“y1”：50，“y2”：55}，{“innerrroi”：“y2”：390”：74}}}，{“lineRoi”：{“x1”：202，“x2”：197，“y1”：1，“y2”：680}，{“lineRoi”：{“x1”：380，“x2”：372，“y1”：1，“y2:680}}}，{}，}，{}，}，{
object.obj0.outerRects.forEach（函数（a）{
如果（a.行）{
a、 行排序（函数（a，b）{
返回a.lineRoi.x1-b.lineRoi.x1；
});
a、 行。forEach（函数（b）{
if（b.innerRect）{
b、 排序（函数（a，b）{
返回a.innerRoi.y1-b.innerRoi.y1；
});
}
});
}
});
document.write（''+JSON.stringify（object，0,4）+''）请添加想要的结果。并添加参考点。请检查我在问题中的编辑。谢谢。这非常有用。不过我有一个疑问。outerRects还将是一个项目列表，必须根据其位置（x，y）进行排序。也是随机抽取的。那么我该如何从左到右对它们进行分类呢？我的坏消息。但是必须对内部矩形进行排序，以便具有较高值的点y（因为它必须从上到下绘制）必须位于列表中的第一个。我已经编辑了这个问题。：）如果排序顺序为反向
returna.lineRoi.x1-b.lineRoi.x1，则可以更改返回值。对象
obj0
和
obj1
无法排序，因为对象没有顺序，或者您是指
outerec
中的项目？是。如果您注意到outerRects是一个具有属性outerRectRoi的对象数组，即画布上的x，y坐标。我需要它们也从画布的左到右排序。