alessandro trinca tornidor
commited on
Commit
•
9bca4cd
1
Parent(s):
217ced2
[feat] PageLisaMap.vue: show the LISA text response on map page
Browse files
static/src/components/PageLisaMap.vue
CHANGED
@@ -63,7 +63,7 @@
|
|
63 |
{statName: 'current map name/type', statValue: currentBaseMapNameRef}
|
64 |
]"/>
|
65 |
</div>
|
66 |
-
|
67 |
<div v-if="responseMessageRef === waitingString"/>
|
68 |
<h2 v-else-if="responseMessageRef || responseMessageRef == '-'" class="text-lg text-red-600">
|
69 |
{{ responseMessageRef }}</h2>
|
@@ -108,6 +108,7 @@ import {
|
|
108 |
promptPlaceHolder,
|
109 |
promptTextArray,
|
110 |
responseMessageRef,
|
|
|
111 |
Satellite,
|
112 |
waitingString
|
113 |
} from './constants'
|
|
|
63 |
{statName: 'current map name/type', statValue: currentBaseMapNameRef}
|
64 |
]"/>
|
65 |
</div>
|
66 |
+
<h2>LISA response: <span class="text-lg text-blue-600">{{ responseMessageLisaRef }}</span></h2>
|
67 |
<div v-if="responseMessageRef === waitingString"/>
|
68 |
<h2 v-else-if="responseMessageRef || responseMessageRef == '-'" class="text-lg text-red-600">
|
69 |
{{ responseMessageRef }}</h2>
|
|
|
108 |
promptPlaceHolder,
|
109 |
promptTextArray,
|
110 |
responseMessageRef,
|
111 |
+
responseMessageLisaRef,
|
112 |
Satellite,
|
113 |
waitingString
|
114 |
} from './constants'
|
static/src/components/constants.ts
CHANGED
@@ -11,11 +11,12 @@ export const numberOfPolygonsRef = ref(0)
|
|
11 |
export const numberOfPredictedMasksRef = ref(0)
|
12 |
export const responseMessageRef = ref("-")
|
13 |
export const geojsonRef = ref("geojsonOutput-placeholder")
|
|
|
14 |
|
15 |
export const promptPlaceHolder = "You are a skilled gis analyst with a lot of expertise " +
|
16 |
-
"in photogrammetry
|
17 |
export const promptTextArray = [
|
18 |
-
"You need to identify the areas with trees in this photogrammetric image. Please output segmentation mask
|
19 |
"You need to identify the roads in this photogrammetric image. Please output segmentation mask and explain why.",
|
20 |
"You need to identify the lake in this photogrammetric image. Please output segmentation mask, explain why and describe what you identified.",
|
21 |
"Describe what do you can identify in this photogrammetric image."
|
|
|
11 |
export const numberOfPredictedMasksRef = ref(0)
|
12 |
export const responseMessageRef = ref("-")
|
13 |
export const geojsonRef = ref("geojsonOutput-placeholder")
|
14 |
+
export const responseMessageLisaRef = ref("-")
|
15 |
|
16 |
export const promptPlaceHolder = "You are a skilled gis analyst with a lot of expertise " +
|
17 |
+
"in photogrammetry, remote sensing and geomorphology field."
|
18 |
export const promptTextArray = [
|
19 |
+
"You need to identify the areas with trees in this photogrammetric image. Please output segmentation mask.",
|
20 |
"You need to identify the roads in this photogrammetric image. Please output segmentation mask and explain why.",
|
21 |
"You need to identify the lake in this photogrammetric image. Please output segmentation mask, explain why and describe what you identified.",
|
22 |
"Describe what do you can identify in this photogrammetric image."
|
static/src/components/helpers.ts
CHANGED
@@ -1,6 +1,7 @@
|
|
1 |
import L, { icon, Evented as LEvented, type LatLng, Map as LMap } from 'leaflet'
|
2 |
import 'leaflet-providers'
|
3 |
import {
|
|
|
4 |
responseMessageRef,
|
5 |
waitingString,
|
6 |
durationRef,
|
@@ -165,6 +166,7 @@ export const getGeoJSONRequest = async (
|
|
165 |
urlApi: string
|
166 |
) => {
|
167 |
responseMessageRef.value = waitingString
|
|
|
168 |
console.log(`getGeoJSONRequest urlApi: ${urlApi} ...`)
|
169 |
const data = await fetch(urlApi, {
|
170 |
method: 'POST',
|
@@ -181,6 +183,15 @@ export const getGeoJSONRequest = async (
|
|
181 |
const parsed = JSON.parse(output.body)
|
182 |
const { geojson, n_predictions, n_shapes_geojson } = parsed.output
|
183 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
184 |
const parsedGeojson = JSON.parse(geojson)
|
185 |
durationRef.value = parsed.duration_run
|
186 |
numberOfPolygonsRef.value = n_shapes_geojson
|
|
|
1 |
import L, { icon, Evented as LEvented, type LatLng, Map as LMap } from 'leaflet'
|
2 |
import 'leaflet-providers'
|
3 |
import {
|
4 |
+
responseMessageLisaRef,
|
5 |
responseMessageRef,
|
6 |
waitingString,
|
7 |
durationRef,
|
|
|
166 |
urlApi: string
|
167 |
) => {
|
168 |
responseMessageRef.value = waitingString
|
169 |
+
responseMessageLisaRef.value = waitingString
|
170 |
console.log(`getGeoJSONRequest urlApi: ${urlApi} ...`)
|
171 |
const data = await fetch(urlApi, {
|
172 |
method: 'POST',
|
|
|
183 |
const parsed = JSON.parse(output.body)
|
184 |
const { geojson, n_predictions, n_shapes_geojson } = parsed.output
|
185 |
|
186 |
+
try {
|
187 |
+
console.log("getGeoJSONRequest parsed.output output_string:", parsed.output.output_string, "#")
|
188 |
+
const { output_string } = parsed.output
|
189 |
+
responseMessageLisaRef.value = output_string
|
190 |
+
} catch(e) {
|
191 |
+
console.log("getGeoJSONRequest parsed.output e:", e, "#")
|
192 |
+
responseMessageLisaRef.value = 'error: check the logs'
|
193 |
+
}
|
194 |
+
|
195 |
const parsedGeojson = JSON.parse(geojson)
|
196 |
durationRef.value = parsed.duration_run
|
197 |
numberOfPolygonsRef.value = n_shapes_geojson
|