Differences
This shows you the differences between two versions of the page.
|
isi:laboratoare:03 [2025/10/12 22:57] sorin.ciolofan [Task] |
isi:laboratoare:03 [2025/10/17 15:22] (current) sorin.ciolofan [Task] |
||
|---|---|---|---|
| Line 32: | Line 32: | ||
| **Task 1** | **Task 1** | ||
| - | Creați o singură aplicație web care să includă Routing, Place Search, Address Search | + | Creați o singură aplicație web care să includă Routing, Place Search, Address Search. |
| + | Plasati controalele de directii (rutare), cautare locatii si cautare adresa respectind layoutul din figura de mai jos | ||
| + | |||
| + | {{:isi:laboratoare:lab3:l3_1.png?600|}} | ||
| /*<note tip>Sugestie: folosiți aplicația realizată în laboratorul anterior.</note>*/ | /*<note tip>Sugestie: folosiți aplicația realizată în laboratorul anterior.</note>*/ | ||
| + | |||
| **Task 2** | **Task 2** | ||
| + | Observati ca daca dati click pe o locatie (cafenea, parc, benzinarie, etc) nu mai este afisat popup-ul aferent locatiei ci acel click este considerat ca punct de plecare pentru rutare. Modificati codul astfel incat rutarea sa se faca numai daca se da click pe harta, in afara locatiilor, iar daca se da click pe o locatie se afiseaza popup-ul. | ||
| + | |||
| + | <note> | ||
| + | Indicatie: Trebuie diferentiat ce tip de click se intampla: feature/graphic si atunci se deschide popup-ul sau punct obisnuit de pe harta si atunci se continua cu rutarea. Puteti folosi functia [[https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html#hitTest|hitTest]] in acest scop. | ||
| + | </note> | ||
| + | |||
| + | <code> | ||
| + | viewElement.addEventListener("arcgisViewClick", async (event) => { | ||
| + | const view = viewElement.view; | ||
| + | const hit = await view.hitTest(event.detail); | ||
| + | if (hit.results.length > 0 && hit.results[0].graphic.attributes?.PlaceName) { | ||
| + | // deschide popup | ||
| + | ..... | ||
| + | return; // opreste rutarea | ||
| + | } | ||
| + | //continua cu rutarea | ||
| + | ...... | ||
| + | }); | ||
| + | </code> | ||
| + | |||
| + | **Task 3** | ||
| Realizați setup-ul proiectului Angular de mai jos, pe care îl vom folosi în laboratorul următor. Verificați că aplicația rulează în browser fără erori: | Realizați setup-ul proiectului Angular de mai jos, pe care îl vom folosi în laboratorul următor. Verificați că aplicația rulează în browser fără erori: | ||
| Line 98: | Line 123: | ||
| - | ==== Resurse ==== | + | /*==== Resurse ====*/ |
