Version 4 (modified by 5 weeks ago) ( diff ) | ,
---|
ИД(5) Прикажување патека помеѓу простории
Има два начини за навигација помеѓу простории:
- Со внесување на сегашна локација и посакувана дестинација
- Со клик на копчето за навигација на дадена просторија
Ќе го разгледаме начинот 2 бидејќи е поинтуитивен за користење.
Корисникот клика на просторијата до која сака да се насочи и се појавува менито за детални информации на просторијата. Со клик на копчето "Navigate" започнува процесот за навигација.
- За навигација се потребни параметрите "from" и "to". Начинот 2. се разликува од 1. во тоа што за параметар "from", секогаш го зема главниот влез на мапата кој се поставува при цртање на истата. Всушност ова се случува секогаш кога параметарот "from" е изоставен.
- Со користење на httpService" се праќа барање до Spring апкликацијата за навигација, каде што се наоѓа графот.
httpService.setAuthenticated()
поставува Authorization заглавје во барањето и укажува дека треба да се автентицира овој повик, со користење на JWT.
За да се изврши методот за навигација кој одговара на повикот од React апликацијата, прво треба да се вратиме малку назад, до самото вчитување на страната. во Spring апликацијата, при секое вчитување на поглед на мапа, се иницијализира "тежински граф" за дадената мапа, кој ги содржи како јазли, патеките помеѓу просториите .
Функцијата
graphService.construct(floors)
e задолжена за креирање на графот кои ги поврзува сите соби на сите спратови на мапата. За секој спрат се прави следното:
- Парсирање на податоците (json) на фигурите кои се поставени на тој спрат, односно креирање јазли
- Вчитување и поврзување на јазлите во графот.
За да се креираат јазли прво се десеријализираат податоците за сите фигури од JSON формат во Shape објект.
JSON репрезентација на фигура:
{"x":689,"y":465, "radiusX":5,"radiusY":7, "tailHeight":12,"fill":"#f60000", "stroke":"#1b1b1b","strokeWidth":1, "draggable":true,"name":"mapObj", "shadowForStrokeEnabled":false, "obj_name":"Pin4 [1F]", \"connected_pins\":[\"Stairs6 [1F]\",\"Pin6 [1F]\",\"Pin5 [1F]\"], \"description":"","floor_num":1},"className":"InfoPin"}
Структурата на Shape e соодветна со структурата на JSON репрезентацијата на фигурата.
Целата идеја на оваа функција е да креира јазли т.е MapNode и за секој јазол, да зачува со кој други јазли е тој поврзан, со цел лесно составување на графот подоцна. Поврзаните јазли се наоѓаат во "connected_pins" од JSON'от.
Attachments (14)
- nav_1.png (148.3 KB ) - added by 5 weeks ago.
- nav_2.png (148.3 KB ) - added by 5 weeks ago.
- nav_3.png (80.0 KB ) - added by 5 weeks ago.
- nav_4.png (56.2 KB ) - added by 5 weeks ago.
- nav_5*.png (56.2 KB ) - added by 5 weeks ago.
- nav_6.png (46.6 KB ) - added by 5 weeks ago.
- nav_7.png (103.2 KB ) - added by 5 weeks ago.
- nav_8.png (81.4 KB ) - added by 5 weeks ago.
- nav_9.png (43.3 KB ) - added by 5 weeks ago.
- nav_10.png (17.2 KB ) - added by 5 weeks ago.
- nav_11.png (53.5 KB ) - added by 5 weeks ago.
- nav_12.png (87.6 KB ) - added by 5 weeks ago.
- nav_14.png (19.4 KB ) - added by 5 weeks ago.
- nav_13.png (156.9 KB ) - added by 5 weeks ago.
Download all attachments as: .zip