Skip to content

Commit b54a53c

Browse files
bekirbostancibekirbostanci
committed
Add documentation for Route Graph Generation LIF Editor
1 parent 11909db commit b54a53c

1 file changed

Lines changed: 175 additions & 0 deletions

File tree

‎tutorials/docs/route_graph_generation_lif_editor.rst‎

Lines changed: 175 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,175 @@
1+
.. _route_graph_generation_lif_editor_lif_editor:
2+
3+
Route Graph Generation LIF Editor
4+
*********************************
5+
6+
- `Overview`_
7+
- `Requirements`_
8+
- `Tutorial Steps`_
9+
10+
Overview
11+
========
12+
A route can also be created using the **VDA LIF Editor**, a web-based open-source tool. This project was developed to present floor plans in a standardized format defined by the VDA. With the VDA LIF Editor, you can generate both GeoJSON and LIF formats simultaneously.
13+
14+
Website: https://vda5050-lif-editor.vercel.app/
15+
16+
Requirements
17+
============
18+
This is an online web-based tool, so no installation is required. You can use it directly in your browser.
19+
For local installation, you can use the following link: https://github.com/bekirbostanci/vda5050_lif_editor
20+
21+
Tutorial Steps
22+
==============
23+
24+
1. Edit Frame
25+
-------------
26+
27+
Click the **'Edit'** button under the **'Layout'** section in the left sidebar. This will open a new popup where you can edit the layout name. Click the **'Save'** button to save it.
28+
29+
.. note::
30+
You can also change the layout name after creating the layout.
31+
32+
|
33+
34+
.. image:: images/route_graph_generation_lif_editor/frame_name.png
35+
:height: 550px
36+
:width: 530px
37+
:align: center
38+
39+
|
40+
41+
2. Set Up Coordinate System
42+
---------------------------
43+
44+
Click the **'Edit'** button under the **'Layout'** section in the left sidebar. In the popup, upload your floor plan image using the **'Background Image'** section.
45+
After uploading the image, four input fields will appear. Set the image width and height in meters, and specify the origin coordinates (X, Y).
46+
The origin is the bottom-left corner of the image.
47+
Click the **'Save'** button to save and close the popup.
48+
49+
.. note::
50+
If you don't see the image, zoom out the map and check the origin position of your image.
51+
52+
|
53+
54+
.. image:: images/route_graph_generation_lif_editor/setup_coordinate_system.png
55+
:height: 757px
56+
:width: 458px
57+
:align: center
58+
59+
|
60+
61+
3. Node Operations
62+
------------------
63+
64+
Add Node
65+
~~~~~~~~
66+
Now you can add nodes to the map. There are two ways to do this:
67+
1. Click directly on the map to add a node. This will create a node automatically. If you want to change its properties, click on the node and edit its information in the right sidebar.
68+
2. Click the **'Node'** button under the **'Create Item'** section in the left sidebar. This will display the **'Create Node'** section in the right sidebar. Fill in the node details and click **'Save'** to create the node.
69+
70+
.. note::
71+
If the **'Fast Create'** toggle is on, you cannot create nodes using the right sidebar (method 2). You must turn the toggle off first.
72+
73+
|
74+
75+
.. image:: images/route_graph_generation_lif_editor/add_node.png
76+
:height: 520px
77+
:width: 440px
78+
:align: center
79+
80+
|
81+
82+
Delete Node
83+
~~~~~~~~~~~
84+
To delete a node, click on it (a glowing orange border will appear around the selected node), then click the **'Delete'** button in the right sidebar.
85+
86+
|
87+
88+
.. image:: images/route_graph_generation_lif_editor/delete_node.png
89+
:height: 520px
90+
:width: 440px
91+
:align: center
92+
93+
|
94+
95+
4. Edge Operations
96+
------------------
97+
98+
Add Edge
99+
~~~~~~~~
100+
Now we can add edges to the map. There are two ways to create edges:
101+
1. Select a node, enter the target node ID in the **'Connected Nodes'** input in the right sidebar, and select the node from the list. This will create an edge between the selected node and the target node.
102+
103+
|
104+
105+
.. image:: images/route_graph_generation_lif_editor/add_edge_normal.png
106+
:height: 520px
107+
:width: 440px
108+
:align: center
109+
110+
|
111+
112+
2. If the **'Fast Create'** toggle is on, clicking on the map will automatically connect the new node to the previously selected node.
113+
114+
|
115+
116+
.. image:: images/route_graph_generation_lif_editor/add_edge_fast_create.png
117+
:height: 520px
118+
:width: 440px
119+
:align: center
120+
121+
|
122+
123+
Delete Edge
124+
~~~~~~~~~~~
125+
To delete an edge, click on it (the edge color will change to orange), then click the **'Delete'** button in the right sidebar.
126+
127+
|
128+
129+
.. image:: images/route_graph_generation_lif_editor/delete_edge.png
130+
:height: 520px
131+
:width: 440px
132+
:align: center
133+
134+
|
135+
136+
5. Check GeoJSON
137+
----------------
138+
Click the **'ROS'** menu button on the top bar to view the generated GeoJSON.
139+
140+
|
141+
142+
.. image:: images/route_graph_generation_lif_editor/check_geojson.png
143+
:height: 520px
144+
:width: 440px
145+
:align: center
146+
147+
|
148+
149+
.. image:: images/route_graph_generation_lif_editor/check_geojson_1.png
150+
:height: 520px
151+
:width: 440px
152+
:align: center
153+
154+
|
155+
156+
6. Export to GeoJSON
157+
--------------------
158+
You are now ready to export the node and edge layers as GeoJSON files. Click the **'Save'** button on the top bar and then select **'Export ROS GeoJSON'**.
159+
160+
|
161+
162+
.. image:: images/route_graph_generation_lif_editor/export_geojson.png
163+
:height: 520px
164+
:width: 440px
165+
:align: center
166+
167+
|
168+
169+
7. Congratulations
170+
------------------
171+
Your graph is now ready to be used by the Nav2 route! If you want to edit the graph later, you should also export the LIF file.
172+
Click the **'Save'** button on the top bar and select **'Export LIF'**.
173+
To edit, reopen the LIF file in the VDA LIF Editor and make your changes. You can also re-export the LIF file as GeoJSON.
174+
175+
**Happy Routing!**

0 commit comments

Comments
 (0)