Переглянути джерело

update the whole graphics section

Eren Yilmaz 6 роки тому
батько
коміт
777c7929b7
5 змінених файлів з 1299 додано та 32 видалено
  1. 995 1
      big.json
  2. 37 29
      doc/chapter/3ui.tex
  3. BIN
      doc/img/full-application-example.png
  4. 193 1
      save.json
  5. 74 1
      test.json

+ 995 - 1
big.json

@@ -1 +1,995 @@
-{"layers":[[{"layers":[],"edges":[],"name":"0"}],[{"layers":[],"edges":[],"name":"1"},{"layers":[],"edges":[],"name":"2"},{"layers":[],"edges":[],"name":"3"}],[{"layers":[],"edges":[],"name":"4"},{"layers":[],"edges":[],"name":"5"}],[{"layers":[],"edges":[],"name":"6"},{"layers":[],"edges":[],"name":"7"},{"layers":[],"edges":[],"name":"8"}],[{"layers":[[{"layers":[],"edges":[],"name":"0"},{"layers":[],"edges":[],"name":"1"},{"layers":[],"edges":[],"name":"2"},{"layers":[],"edges":[],"name":"3"}],[{"layers":[],"edges":[],"name":"4"},{"layers":[],"edges":[],"name":"5"},{"layers":[[{"layers":[],"edges":[],"name":"0"},{"layers":[],"edges":[],"name":"1"}],[{"layers":[],"edges":[],"name":"2"}]],"edges":[{"source":"0","target":"2"},{"source":"1","target":"2"}],"name":"6"}],[{"layers":[],"edges":[],"name":"7"},{"layers":[],"edges":[],"name":"8"}],[{"layers":[],"edges":[],"name":"9"}],[{"layers":[],"edges":[],"name":"10"}],[{"layers":[],"edges":[],"name":"11"},{"layers":[],"edges":[],"name":"12"},{"layers":[[{"layers":[],"edges":[],"name":"0"},{"layers":[],"edges":[],"name":"1"}]],"edges":[],"name":"13"},{"layers":[[{"layers":[],"edges":[],"name":"0"}],[{"layers":[],"edges":[],"name":"1"}],[{"layers":[],"edges":[],"name":"2"},{"layers":[],"edges":[],"name":"3"}],[{"layers":[],"edges":[],"name":"4"},{"layers":[],"edges":[],"name":"5"},{"layers":[],"edges":[],"name":"6"},{"layers":[],"edges":[],"name":"7"}],[{"layers":[],"edges":[],"name":"8"},{"layers":[],"edges":[],"name":"9"},{"layers":[],"edges":[],"name":"10"},{"layers":[],"edges":[],"name":"11"}],[{"layers":[],"edges":[],"name":"12"}]],"edges":[{"source":"1","target":"3"},{"source":"3","target":"4"},{"source":"3","target":"5"},{"source":"3","target":"6"},{"source":"7","target":"8"},{"source":"5","target":"9"},{"source":"5","target":"10"},{"source":"7","target":"11"},{"source":"8","target":"12"},{"source":"11","target":"12"}],"name":"14"}]],"edges":[{"source":"0","target":"4"},{"source":"2","target":"4"},{"source":"0","target":"5"}],"name":"9"},{"layers":[],"edges":[],"name":"10"},{"layers":[],"edges":[],"name":"11"}],[{"layers":[[{"layers":[],"edges":[],"name":"0"}],[{"layers":[],"edges":[],"name":"1"},{"layers":[],"edges":[],"name":"2"}],[{"layers":[],"edges":[],"name":"3"},{"layers":[],"edges":[],"name":"4"}],[{"layers":[],"edges":[],"name":"5"},{"layers":[],"edges":[],"name":"6"},{"layers":[],"edges":[],"name":"7"}]],"edges":[{"source":"0","target":"2"},{"source":"4","target":"5"},{"source":"3","target":"6"},{"source":"3","target":"7"}],"name":"12"},{"layers":[],"edges":[],"name":"13"},{"layers":[],"edges":[],"name":"14"}],[{"layers":[],"edges":[],"name":"15"},{"layers":[],"edges":[],"name":"16"},{"layers":[[{"layers":[],"edges":[],"name":"0"}],[{"layers":[],"edges":[],"name":"1"},{"layers":[],"edges":[],"name":"2"},{"layers":[],"edges":[],"name":"3"},{"layers":[],"edges":[],"name":"4"}],[{"layers":[],"edges":[],"name":"5"}],[{"layers":[],"edges":[],"name":"6"},{"layers":[],"edges":[],"name":"7"},{"layers":[],"edges":[],"name":"8"},{"layers":[[{"layers":[],"edges":[],"name":"0"}],[{"layers":[],"edges":[],"name":"1"}],[{"layers":[],"edges":[],"name":"2"}],[{"layers":[],"edges":[],"name":"3"},{"layers":[],"edges":[],"name":"4"}],[{"layers":[],"edges":[],"name":"5"},{"layers":[],"edges":[],"name":"6"},{"layers":[],"edges":[],"name":"7"}],[{"layers":[],"edges":[],"name":"8"}],[{"layers":[],"edges":[],"name":"9"},{"layers":[],"edges":[],"name":"10"},{"layers":[],"edges":[],"name":"11"}],[{"layers":[],"edges":[],"name":"12"},{"layers":[],"edges":[],"name":"13"},{"layers":[],"edges":[],"name":"14"},{"layers":[],"edges":[],"name":"15"}]],"edges":[{"source":"3","target":"6"},{"source":"4","target":"6"},{"source":"8","target":"9"},{"source":"9","target":"14"},{"source":"11","target":"14"},{"source":"9","target":"15"}],"name":"9"}],[{"layers":[],"edges":[],"name":"10"},{"layers":[[{"layers":[],"edges":[],"name":"0"},{"layers":[],"edges":[],"name":"1"},{"layers":[],"edges":[],"name":"2"},{"layers":[],"edges":[],"name":"3"}],[{"layers":[],"edges":[],"name":"4"},{"layers":[],"edges":[],"name":"5"}],[{"layers":[],"edges":[],"name":"6"},{"layers":[],"edges":[],"name":"7"},{"layers":[],"edges":[],"name":"8"},{"layers":[],"edges":[],"name":"9"}],[{"layers":[],"edges":[],"name":"10"},{"layers":[],"edges":[],"name":"11"},{"layers":[],"edges":[],"name":"12"}],[{"layers":[],"edges":[],"name":"13"}],[{"layers":[],"edges":[],"name":"14"},{"layers":[],"edges":[],"name":"15"}],[{"layers":[],"edges":[],"name":"16"}]],"edges":[{"source":"0","target":"5"},{"source":"1","target":"5"},{"source":"2","target":"5"},{"source":"4","target":"7"},{"source":"4","target":"8"},{"source":"7","target":"10"},{"source":"6","target":"11"},{"source":"7","target":"12"},{"source":"9","target":"12"},{"source":"10","target":"13"},{"source":"12","target":"13"},{"source":"13","target":"14"}],"name":"11"}],[{"layers":[],"edges":[],"name":"12"},{"layers":[[{"layers":[],"edges":[],"name":"0"},{"layers":[],"edges":[],"name":"1"},{"layers":[],"edges":[],"name":"2"}],[{"layers":[],"edges":[],"name":"3"},{"layers":[],"edges":[],"name":"4"},{"layers":[],"edges":[],"name":"5"}],[{"layers":[],"edges":[],"name":"6"}],[{"layers":[],"edges":[],"name":"7"},{"layers":[],"edges":[],"name":"8"}]],"edges":[{"source":"2","target":"3"},{"source":"0","target":"4"},{"source":"3","target":"6"}],"name":"13"},{"layers":[],"edges":[],"name":"14"},{"layers":[],"edges":[],"name":"15"}],[{"layers":[],"edges":[],"name":"16"},{"layers":[],"edges":[],"name":"17"},{"layers":[],"edges":[],"name":"18"}]],"edges":[{"source":"0","target":"2"},{"source":"1","target":"5"},{"source":"5","target":"9"},{"source":"6","target":"10"},{"source":"9","target":"10"},{"source":"6","target":"11"},{"source":"11","target":"13"},{"source":"11","target":"15"},{"source":"13","target":"16"},{"source":"12","target":"17"}],"name":"17"}]],"edges":[{"source":"0","target":"1"},{"source":"0","target":"2"},{"source":"0","target":"3"},{"source":"4","target":"6"},{"source":"5","target":"6"},{"source":"8","target":"9"},{"source":"7","target":"10"},{"source":"7","target":"11"},{"source":"8","target":"11"},{"source":"9","target":"13"},{"source":"11","target":"13"},{"source":"9","target":"14"},{"source":"10","target":"14"},{"source":"14","target":"15"},{"source":"12","target":"16"},{"source":"13","target":"16"},{"source":"14","target":"17"}]}
+{
+  "layers": [
+    [
+      {
+        "layers": [],
+        "edges": [],
+        "name": "0"
+      }
+    ],
+    [
+      {
+        "layers": [],
+        "edges": [],
+        "name": "1"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "2"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "3"
+      }
+    ],
+    [
+      {
+        "layers": [],
+        "edges": [],
+        "name": "4"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "5"
+      }
+    ],
+    [
+      {
+        "layers": [],
+        "edges": [],
+        "name": "6"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "7"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "8"
+      }
+    ],
+    [
+      {
+        "layers": [
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "0"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "1"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "2"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "3"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "4"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "5"
+            },
+            {
+              "layers": [
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "0"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "1"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "2"
+                  }
+                ]
+              ],
+              "edges": [
+                {
+                  "source": "0",
+                  "target": "2"
+                },
+                {
+                  "source": "1",
+                  "target": "2"
+                }
+              ],
+              "name": "6"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "7"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "8"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "9"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "10"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "11"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "12"
+            },
+            {
+              "layers": [
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "0"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "1"
+                  }
+                ]
+              ],
+              "edges": [],
+              "name": "13"
+            },
+            {
+              "layers": [
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "0"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "1"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "2"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "3"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "4"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "5"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "6"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "7"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "8"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "9"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "10"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "11"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "12"
+                  }
+                ]
+              ],
+              "edges": [
+                {
+                  "source": "1",
+                  "target": "3"
+                },
+                {
+                  "source": "3",
+                  "target": "4"
+                },
+                {
+                  "source": "3",
+                  "target": "5"
+                },
+                {
+                  "source": "3",
+                  "target": "6"
+                },
+                {
+                  "source": "7",
+                  "target": "8"
+                },
+                {
+                  "source": "5",
+                  "target": "9"
+                },
+                {
+                  "source": "5",
+                  "target": "10"
+                },
+                {
+                  "source": "7",
+                  "target": "11"
+                },
+                {
+                  "source": "8",
+                  "target": "12"
+                },
+                {
+                  "source": "11",
+                  "target": "12"
+                }
+              ],
+              "name": "14"
+            }
+          ]
+        ],
+        "edges": [
+          {
+            "source": "0",
+            "target": "4"
+          },
+          {
+            "source": "2",
+            "target": "4"
+          },
+          {
+            "source": "0",
+            "target": "5"
+          }
+        ],
+        "name": "9"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "10"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "11"
+      }
+    ],
+    [
+      {
+        "layers": [
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "0"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "1"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "2"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "3"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "4"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "5"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "6"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "7"
+            }
+          ]
+        ],
+        "edges": [
+          {
+            "source": "0",
+            "target": "2"
+          },
+          {
+            "source": "4",
+            "target": "5"
+          },
+          {
+            "source": "3",
+            "target": "6"
+          },
+          {
+            "source": "3",
+            "target": "7"
+          }
+        ],
+        "name": "12"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "13"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "14"
+      }
+    ],
+    [
+      {
+        "layers": [],
+        "edges": [],
+        "name": "15"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "16"
+      },
+      {
+        "layers": [
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "0"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "1"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "2"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "3"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "4"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "5"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "6"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "7"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "8"
+            },
+            {
+              "layers": [
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "0"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "1"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "2"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "3"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "4"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "5"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "6"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "7"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "8"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "9"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "10"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "11"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "12"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "13"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "14"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "15"
+                  }
+                ]
+              ],
+              "edges": [
+                {
+                  "source": "3",
+                  "target": "6"
+                },
+                {
+                  "source": "4",
+                  "target": "6"
+                },
+                {
+                  "source": "8",
+                  "target": "9"
+                },
+                {
+                  "source": "9",
+                  "target": "14"
+                },
+                {
+                  "source": "11",
+                  "target": "14"
+                },
+                {
+                  "source": "9",
+                  "target": "15"
+                }
+              ],
+              "name": "9"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "10"
+            },
+            {
+              "layers": [
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "0"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "1"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "2"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "3"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "4"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "5"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "6"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "7"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "8"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "9"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "10"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "11"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "12"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "13"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "14"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "15"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "16"
+                  }
+                ]
+              ],
+              "edges": [
+                {
+                  "source": "0",
+                  "target": "5"
+                },
+                {
+                  "source": "1",
+                  "target": "5"
+                },
+                {
+                  "source": "2",
+                  "target": "5"
+                },
+                {
+                  "source": "4",
+                  "target": "7"
+                },
+                {
+                  "source": "4",
+                  "target": "8"
+                },
+                {
+                  "source": "7",
+                  "target": "10"
+                },
+                {
+                  "source": "6",
+                  "target": "11"
+                },
+                {
+                  "source": "7",
+                  "target": "12"
+                },
+                {
+                  "source": "9",
+                  "target": "12"
+                },
+                {
+                  "source": "10",
+                  "target": "13"
+                },
+                {
+                  "source": "12",
+                  "target": "13"
+                },
+                {
+                  "source": "13",
+                  "target": "14"
+                }
+              ],
+              "name": "11"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "12"
+            },
+            {
+              "layers": [
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "0"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "1"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "2"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "3"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "4"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "5"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "6"
+                  }
+                ],
+                [
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "7"
+                  },
+                  {
+                    "layers": [],
+                    "edges": [],
+                    "name": "8"
+                  }
+                ]
+              ],
+              "edges": [
+                {
+                  "source": "2",
+                  "target": "3"
+                },
+                {
+                  "source": "0",
+                  "target": "4"
+                },
+                {
+                  "source": "3",
+                  "target": "6"
+                }
+              ],
+              "name": "13"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "14"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "15"
+            }
+          ],
+          [
+            {
+              "layers": [],
+              "edges": [],
+              "name": "16"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "17"
+            },
+            {
+              "layers": [],
+              "edges": [],
+              "name": "18"
+            }
+          ]
+        ],
+        "edges": [
+          {
+            "source": "0",
+            "target": "2"
+          },
+          {
+            "source": "1",
+            "target": "5"
+          },
+          {
+            "source": "5",
+            "target": "9"
+          },
+          {
+            "source": "6",
+            "target": "10"
+          },
+          {
+            "source": "9",
+            "target": "10"
+          },
+          {
+            "source": "6",
+            "target": "11"
+          },
+          {
+            "source": "11",
+            "target": "13"
+          },
+          {
+            "source": "11",
+            "target": "15"
+          },
+          {
+            "source": "13",
+            "target": "16"
+          },
+          {
+            "source": "12",
+            "target": "17"
+          }
+        ],
+        "name": "17"
+      }
+    ]
+  ],
+  "edges": [
+    {
+      "source": "0",
+      "target": "1"
+    },
+    {
+      "source": "0",
+      "target": "2"
+    },
+    {
+      "source": "0",
+      "target": "3"
+    },
+    {
+      "source": "4",
+      "target": "6"
+    },
+    {
+      "source": "5",
+      "target": "6"
+    },
+    {
+      "source": "8",
+      "target": "9"
+    },
+    {
+      "source": "7",
+      "target": "10"
+    },
+    {
+      "source": "7",
+      "target": "11"
+    },
+    {
+      "source": "8",
+      "target": "11"
+    },
+    {
+      "source": "9",
+      "target": "13"
+    },
+    {
+      "source": "11",
+      "target": "13"
+    },
+    {
+      "source": "9",
+      "target": "14"
+    },
+    {
+      "source": "10",
+      "target": "14"
+    },
+    {
+      "source": "14",
+      "target": "15"
+    },
+    {
+      "source": "12",
+      "target": "16"
+    },
+    {
+      "source": "13",
+      "target": "16"
+    },
+    {
+      "source": "14",
+      "target": "17"
+    }
+  ]
+}

+ 37 - 29
doc/chapter/3ui.tex

@@ -1,29 +1,28 @@
 Note that since the application is still under construction, so not all screenshots may be up to date.
 
 \section{Graphical presentation of the running algorithm}\label{sec:graphicalPresentationOfTheRunningAlgorithm}
-\TODO{under construction}
-\TODO{reference~\ref{fig:example}}
-\TODO{reference~\ref{fig:originalpapergraph}}
-\TODO{reference~\ref{fig:sketch}}
+A first sketch of how we want \appname to look is shown in figure~\ref{fig:sketch}.
+The current development status is displayed in figure~\ref{fig:full-application-example}.
+Another example graph and an explanation of the shapes and colors is provided in figure~\ref{fig:example}.
+Figure~\ref{fig:originalpapergraph} compares our results to those of Brandes and Köpf~\cite{brandes_fast_2001}.
 
-\begin{figure}
+\begin{figure}[htp]
     \centering
-    \begin{subfigure}{\textwidth}
-        \centering
-        \includegraphics[width=\linewidth]{img/bk-example-theirs}
-        \caption{An example graph directly taken from the paper of Brandes and Köpf~\cite{brandes_fast_2001}.}
-        \label{fig:theirs}
-    \end{subfigure}\\\vspace{4mm}
-    \begin{subfigure}{\textwidth}
-        \centering
-        \includegraphics[width=0.4\linewidth]{img/bk-example-ours}
-        \caption[The same graph as~\ref{fig:theirs}, displayed by \appname.]{The same graph as~\ref{fig:theirs}, displayed by \appname.
-        The layouts are leftmost (first column), rightmost (third column), upper (first row) and lower (third row), respectively.
-        The balanced layout is in the center.}
-        \label{fig:ours}
-    \end{subfigure}\\\vspace{4mm}
-    \caption[Comparison with~\cite{brandes_fast_2001}]{Comparison of the implementation with the results of  Brandes and Köpf~\cite{brandes_fast_2001}}
-    \label{fig:originalpapergraph}
+    \includegraphics[width=\linewidth]{img/skizze}
+    \caption[First sketch of the planned layout]{A first sketch of the planned layout, created with Microsoft Paint.
+    The buttons are (first row, from left to right): step over, step into, step out, run, pause, debug; and (second row, from left to right): step back, step back out, run backwards.
+    The actions corresponding to the buttons are the same as described for the keyboard input in table~\ref{table:keys}, at least for the features that are already implemented.
+    The left four rectangles show the progress of the four extremal layouts.
+    The right rectangle shows pseudocode of the algorithm and the position of the current step.}
+    \label{fig:sketch}
+\end{figure}
+
+\begin{figure}[htp]
+    \centering
+    \includegraphics[width=\linewidth]{img/full-application-example}
+    \caption[Full application window]{The full window of the application before any steps of the algorithm have been executed.
+    The displayed graph has been loaded from figure~\ref{fig:json-example}.}
+    \label{fig:full-application-example}
 \end{figure}
 
 \begin{figure}[htp]
@@ -39,15 +38,24 @@ Note that since the application is still under construction, so not all screensh
     \label{fig:example}
 \end{figure}
 
-\begin{figure}[htp]
+\begin{figure}
     \centering
-    \includegraphics[width=\linewidth]{img/skizze}
-    \caption[First sketch of the planned layout]{A first sketch of the planned layout, created with Microsoft Paint.
-    The buttons are (first row, from left to right): step over, step into, step out, run, pause, debug; and (second row, from left to right): step back, step back out, run backwards.
-    The actions corresponding to the buttons are the same as described for the keyboard input in table~\ref{table:keys}, at least for the features that are already implemented.
-    The left four rectangles show the progress of the four extremal layouts.
-    The right rectangle shows pseudocode of the algorithm and the position of the current step.}
-    \label{fig:sketch}
+    \begin{subfigure}{\textwidth}
+        \centering
+        \includegraphics[width=\linewidth]{img/bk-example-theirs}
+        \caption{An example graph directly taken from the paper of Brandes and Köpf~\cite{brandes_fast_2001}.}
+        \label{fig:theirs}
+    \end{subfigure}\\\vspace{4mm}
+    \begin{subfigure}{\textwidth}
+        \centering
+        \includegraphics[width=0.4\linewidth]{img/bk-example-ours}
+        \caption[The same graph as~\ref{fig:theirs}, displayed by \appname.]{The same graph as~\ref{fig:theirs}, displayed by \appname.
+        The layouts are leftmost (first column), rightmost (third column), upper (first row) and lower (third row), respectively.
+        The balanced layout is in the center.}
+        \label{fig:ours}
+    \end{subfigure}\\\vspace{4mm}
+    \caption[Comparison with~\cite{brandes_fast_2001}]{Comparison of the implementation with the results of Brandes and Köpf~\cite{brandes_fast_2001}}
+    \label{fig:originalpapergraph}
 \end{figure}
 
 

BIN
doc/img/full-application-example.png


+ 193 - 1
save.json

@@ -1 +1,193 @@
-{"layers":[[{"layers":[],"edges":[],"name":"0"},{"layers":[],"edges":[],"name":"1"},{"layers":[],"edges":[],"name":"2"},{"layers":[],"edges":[],"name":"3"},{"layers":[],"edges":[],"name":"4"}],[{"layers":[],"edges":[],"name":"5"},{"layers":[],"edges":[],"name":"6"},{"layers":[],"edges":[],"name":"7"},{"layers":[],"edges":[],"name":"8"},{"layers":[],"edges":[],"name":"9"}],[{"layers":[],"edges":[],"name":"10"},{"layers":[],"edges":[],"name":"11"},{"layers":[],"edges":[],"name":"12"},{"layers":[],"edges":[],"name":"13"},{"layers":[],"edges":[],"name":"14"}],[{"layers":[],"edges":[],"name":"15"},{"layers":[],"edges":[],"name":"16"},{"layers":[],"edges":[],"name":"17"},{"layers":[],"edges":[],"name":"18"},{"layers":[],"edges":[],"name":"19"}],[{"layers":[],"edges":[],"name":"20"},{"layers":[],"edges":[],"name":"21"},{"layers":[],"edges":[],"name":"22"},{"layers":[],"edges":[],"name":"23"},{"layers":[],"edges":[],"name":"24"}]],"edges":[{"source":"1","target":"8"},{"source":"3","target":"8"},{"source":"0","target":"7"},{"source":"0","target":"6"},{"source":"5","target":"13"},{"source":"6","target":"13"},{"source":"7","target":"14"},{"source":"13","target":"17"},{"source":"10","target":"16"},{"source":"13","target":"16"},{"source":"12","target":"16"},{"source":"19","target":"23"},{"source":"15","target":"22"}]}
+{
+  "layers": [
+    [
+      {
+        "layers": [],
+        "edges": [],
+        "name": "0"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "1"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "2"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "3"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "4"
+      }
+    ],
+    [
+      {
+        "layers": [],
+        "edges": [],
+        "name": "5"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "6"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "7"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "8"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "9"
+      }
+    ],
+    [
+      {
+        "layers": [],
+        "edges": [],
+        "name": "10"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "11"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "12"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "13"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "14"
+      }
+    ],
+    [
+      {
+        "layers": [],
+        "edges": [],
+        "name": "15"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "16"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "17"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "18"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "19"
+      }
+    ],
+    [
+      {
+        "layers": [],
+        "edges": [],
+        "name": "20"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "21"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "22"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "23"
+      },
+      {
+        "layers": [],
+        "edges": [],
+        "name": "24"
+      }
+    ]
+  ],
+  "edges": [
+    {
+      "source": "1",
+      "target": "8"
+    },
+    {
+      "source": "3",
+      "target": "8"
+    },
+    {
+      "source": "0",
+      "target": "7"
+    },
+    {
+      "source": "0",
+      "target": "6"
+    },
+    {
+      "source": "5",
+      "target": "13"
+    },
+    {
+      "source": "6",
+      "target": "13"
+    },
+    {
+      "source": "7",
+      "target": "14"
+    },
+    {
+      "source": "13",
+      "target": "17"
+    },
+    {
+      "source": "10",
+      "target": "16"
+    },
+    {
+      "source": "13",
+      "target": "16"
+    },
+    {
+      "source": "12",
+      "target": "16"
+    },
+    {
+      "source": "19",
+      "target": "23"
+    },
+    {
+      "source": "15",
+      "target": "22"
+    }
+  ]
+}

+ 74 - 1
test.json

@@ -1 +1,74 @@
-{"layers": [[{"name": "n1","width":10,"height":10},{"name":"n2","width":10,"height":10}],[{"name":"n3","width":10,"height":10},{"layers": [[{"name": "n1","width":10,"height":10},{"name":"n2","width":10,"height":10}],[{"name":"n3","width":10,"height":10}]],"edges":[{"source":"n1","target":"n3"},{"source":"n2","target":"n3"}],"name":"n0","width":10,"height":10}]],"edges":[{"source":"n1","target":"n3"},{"source":"n2","target":"n0"},{"source":"n2","target":"n3"}],"name":"n0"}
+{
+  "layers": [
+    [
+      {
+        "name": "n1",
+        "width": 10,
+        "height": 10
+      },
+      {
+        "name": "n2",
+        "width": 10,
+        "height": 10
+      }
+    ],
+    [
+      {
+        "name": "n3",
+        "width": 10,
+        "height": 10
+      },
+      {
+        "layers": [
+          [
+            {
+              "name": "n1",
+              "width": 10,
+              "height": 10
+            },
+            {
+              "name": "n2",
+              "width": 10,
+              "height": 10
+            }
+          ],
+          [
+            {
+              "name": "n3",
+              "width": 10,
+              "height": 10
+            }
+          ]
+        ],
+        "edges": [
+          {
+            "source": "n1",
+            "target": "n3"
+          },
+          {
+            "source": "n2",
+            "target": "n3"
+          }
+        ],
+        "name": "n0",
+        "width": 10,
+        "height": 10
+      }
+    ]
+  ],
+  "edges": [
+    {
+      "source": "n1",
+      "target": "n3"
+    },
+    {
+      "source": "n2",
+      "target": "n0"
+    },
+    {
+      "source": "n2",
+      "target": "n3"
+    }
+  ],
+  "name": "n0"
+}