{ "document": { "id": "TESTING", "name": "My Document", "pages": { "page1": { "id": "page1", "type": "page", "name": "Page 1", "childIndex": 0, "shapes": { "e43559cb-6f41-4ae4-9c49-158ed1ad2f72": { "id": "e43559cb-6f41-4ae4-9c49-158ed1ad2f72", "type": "rectangle", "name": "Rectangle", "parentId": "page1", "childIndex": 3, "point": [100, 100], "size": [100, 100], "radius": 2, "rotation": 0, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" } }, "13448777-d8f5-46cd-8a70-a4259211902e": { "id": "13448777-d8f5-46cd-8a70-a4259211902e", "type": "rectangle", "name": "Rectangle", "parentId": "page1", "childIndex": 4, "point": [500, 400], "size": [200, 200], "radius": 2, "rotation": 0, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" } }, "75010635-8dfb-48ea-9250-719e50e58f02": { "id": "75010635-8dfb-48ea-9250-719e50e58f02", "type": "rectangle", "name": "Rectangle", "parentId": "page1", "childIndex": 5, "point": [384.09, 378.45], "size": [95.20999999999992, 91.1799999999999], "radius": 2, "rotation": 0, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" } }, "c892d665-3311-4e25-a0bf-c4632d777f7e": { "id": "c892d665-3311-4e25-a0bf-c4632d777f7e", "type": "ellipse", "name": "Ellipse", "parentId": "page1", "childIndex": 6, "point": [162.45, 679.23], "radiusX": 102.99999999999997, "radiusY": 102.99999999999994, "rotation": 0, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" } }, "51641de1-9787-41b8-afcc-2c85fd1b24c7": { "id": "51641de1-9787-41b8-afcc-2c85fd1b24c7", "type": "ellipse", "name": "Ellipse", "parentId": "page1", "childIndex": 7, "point": [517.18, 783.54], "radiusX": 102.99999999999997, "radiusY": 102.99999999999994, "rotation": 0, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" } }, "e08c415e-3db3-4d3b-878e-28ce693ec1b0": { "id": "e08c415e-3db3-4d3b-878e-28ce693ec1b0", "type": "ellipse", "name": "Ellipse", "parentId": "page1", "childIndex": 8, "point": [398.99, 810.79], "radiusX": 45.484999999999985, "radiusY": 45.48499999999996, "rotation": 0, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" } }, "fee77127-e779-4576-882b-b1bf7c7e132f": { "id": "fee77127-e779-4576-882b-b1bf7c7e132f", "type": "arrow", "name": "Arrow", "parentId": "page1", "childIndex": 9, "point": [252.85, 1057.5], "rotation": 0, "bend": 0, "handles": { "start": { "id": "start", "index": 0, "point": [0, 0] }, "end": { "id": "end", "index": 1, "point": [0.09000000000000341, 208] }, "bend": { "id": "bend", "index": 2, "point": [0.045000000000001705, 104] } }, "decorations": { "start": null, "middle": null, "end": "Arrow" }, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" } }, "2d842ace-ebc5-4e83-acdf-de29352e5e62": { "id": "2d842ace-ebc5-4e83-acdf-de29352e5e62", "type": "arrow", "name": "Arrow", "parentId": "page1", "childIndex": 10, "point": [616.9, 1124.3], "rotation": 0, "bend": 0, "handles": { "start": { "id": "start", "index": 0, "point": [0, 0] }, "end": { "id": "end", "index": 1, "point": [2.4500000000000455, 185.20000000000005] }, "bend": { "id": "bend", "index": 2, "point": [1.2250000000000227, 92.60000000000002] } }, "decorations": { "start": null, "middle": null, "end": "Arrow" }, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" } }, "b8e4e2c5-c662-4587-bf80-b9820ad8ad7f": { "id": "b8e4e2c5-c662-4587-bf80-b9820ad8ad7f", "type": "arrow", "name": "Arrow", "parentId": "page1", "childIndex": 11, "point": [425.18, 1143.2], "rotation": 0, "bend": 0, "handles": { "start": { "id": "start", "index": 0, "point": [0, 0] }, "end": { "id": "end", "index": 1, "point": [1.8500000000000227, 95.70000000000005] }, "bend": { "id": "bend", "index": 2, "point": [0.9250000000000114, 47.85000000000002] } }, "decorations": { "start": null, "middle": null, "end": "Arrow" }, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" } }, "38e9e750-16c2-4476-93ab-21aeb5f8858f": { "id": "38e9e750-16c2-4476-93ab-21aeb5f8858f", "type": "text", "name": "Text", "parentId": "page1", "childIndex": 12, "point": [207.16, 1422.4], "rotation": 0, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" }, "text": "Hello", "scale": 1 }, "5ba998df-c036-447a-9b88-d96c71394f52": { "id": "5ba998df-c036-447a-9b88-d96c71394f52", "type": "text", "name": "Text", "parentId": "page1", "childIndex": 13, "point": [389.57, 1496.5], "rotation": 0, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" }, "text": "Hello", "scale": 1 }, "3c688979-b190-4270-915b-7d8dd22a2bb7": { "id": "3c688979-b190-4270-915b-7d8dd22a2bb7", "type": "text", "name": "Text", "parentId": "page1", "childIndex": 14, "point": [564.06, 1558.1], "rotation": 0, "style": { "color": "Black", "size": "Medium", "isFilled": false, "dash": "Draw" }, "text": "Hello", "scale": 1 } } } }, "code": { "file0": { "id": "file0", "name": "index.ts", "code": "\nconst draw = new Draw({\n points: [\n ...Utils.getPointsBetween([0, 0], [20, 50]),\n ...Utils.getPointsBetween([20, 50], [100, 20], 3),\n ...Utils.getPointsBetween([100, 20], [100, 100], 10),\n [100, 100],\n ],\n})\n\nconst rectangle = new Rectangle({\n point: [200, 0],\n style: {\n color: ColorStyle.Blue,\n },\n})\n\nconst ellipse = new Ellipse({\n point: [400, 0],\n})\n\nconst arrow = new Arrow({\n start: [600, 0],\n end: [700, 100],\n})\n\nconst radius = 1000\nconst count = 100\nconst center = [350, 50]\n\nfor (let i = 0; i < count; i++) {\n const point = Vec.rotWith(\n Vec.add(center, [radius, 0]),\n center,\n (Math.PI * 2 * i) / count\n )\n\n const dot = new Dot({\n point,\n })\n}\n " } } }, "pageState": { "id": "page1", "camera": { "point": [0, -145], "zoom": 1 }, "selectedIds": {} } }