Fix geocode u poi

This commit is contained in:
Michal Kváček
2024-05-06 16:30:06 +02:00
parent 670e80d998
commit a56c6828b1
5 changed files with 35 additions and 25 deletions
+2 -3
View File
@@ -4,7 +4,6 @@ import {Marker, CustomMarker, Polyline} from "vue3-google-map";
import MapWrapper from "components/map/MapWrapper.vue";
import {useFlightPlanObjects, useFlightPlanUtils} from "src/composables/flightPlan";
import {useGeocode} from "src/composables/geocoding";
import AltitudeLimit from "components/AltitudeLimit.vue";
const props = defineProps({
flightPlan: {
@@ -32,7 +31,7 @@ const emits = defineEmits(["markers-changed", "change-insert-position"]);
const {center} = useGeocode();
const {markerObject, googleMapsMarkerObject, infoWindowObject, editableNameTypes} = useFlightPlanObjects();
const {markerObject, googleMapsMarkerObject, editableNameTypes} = useFlightPlanObjects();
const {getMarkersFrom} = useFlightPlanUtils();
const mapWrap = ref(null);
@@ -108,6 +107,6 @@ const handleMarkerMove = async (idx, event) => {
@dragend="handleMarkerMove(i, $event.latLng)"
/>
</template>
<Polyline :options="{path: track, geodesic: true, strokeColor: '#ff0202', strokeOpacity: 0.5, strokeWeight: 5}"/>
<Polyline :options="{path: track, geodesic: true, strokeColor: '#ff00ff', strokeOpacity: 1, strokeWeight: 3}"/>
</MapWrapper>
</template>
@@ -1,6 +1,5 @@
<script setup>
import {formatDatetime} from "../../composables/datetimeUtils";
import {formatDatetime} from "src/composables/datetimeUtils";
const props = defineProps({
items: {
@@ -23,7 +22,7 @@ const props = defineProps({
</q-item-section>
<q-item-section>
<q-item-label>
{{ flightPlan.name }}
{{ flightPlan.name || "Nepojmenovaný plán" }}
</q-item-label>
<q-item-label caption v-if="flightPlan.plannedTakeoffDatetime">
{{ formatDatetime(flightPlan.plannedTakeoffDatetime) }}
+26 -7
View File
@@ -1,8 +1,9 @@
<script setup>
import {Marker} from "vue3-google-map";
import {onMounted} from "vue";
import {onMounted, ref} from "vue";
import MapWrapper from "components/map/MapWrapper.vue";
import {useGeocode} from "src/composables/geocoding";
import axios from "axios";
const props = defineProps({
gpsLatitude: {
@@ -20,20 +21,28 @@ const props = defineProps({
});
const emits = defineEmits(["update:gpsLatitude", "update:gpsLongitude", "notFound"]);
const {emitModels, setCoordinatesFromGeocode, searchGeocode, center, zoom} = useGeocode(emits);
const emitModels = (lat, lng) => {
emits("update:gpsLatitude", lat);
emits("update:gpsLongitude", lng);
}
const {searchGeocode, center} = useGeocode(emits);
const markerDropped = (position) => {
emitModels(position.latLng.lat(), position.latLng.lng());
}
const zoom = ref(8);
onMounted(() => {
if (props.gpsLatitude && props.gpsLongitude) {
center.value.lng = props.gpsLongitude;
center.value.lat = props.gpsLatitude
} else if (props.label) {
searchGeocode(props.label).then(result => {
searchGeocode(props.label).then(results => {
if (!results) return;
center.value = results[0].geometry.location;
emitModels(center.value.lat, center.value.lng);
zoom.value = 13;
});
setCoordinatesFromGeocode(props.label);
} else {
console.error("Set either label or gps coordinates.");
}
@@ -42,7 +51,17 @@ onMounted(() => {
</script>
<template>
<MapWrapper style="width: 100%; height: 500px" :center="center" :zoom="zoom" v-bind="$attrs">
<Marker :options="{ position: center, title: label, draggable: true }" @dragend="markerDropped"/>
<MapWrapper
:show-info-window="false"
:show-layer-controls="false"
style="width: 100%; height: 500px"
:center="center"
:zoom="zoom"
v-bind="$attrs"
>
<Marker
:options="{ position: center, title: label, draggable: true }"
@dragend="markerDropped"
/>
</MapWrapper>
</template>
+4 -7
View File
@@ -1,7 +1,7 @@
<script setup>
import {Circle, GoogleMap, CustomControl, CustomMarker, Polygon} from "vue3-google-map";
import {GoogleMap, CustomControl, CustomMarker, Polygon} from "vue3-google-map";
import {computed, ref, watch} from "vue";
import {useBasicVectorOperations, useVectorUtilities} from "src/graphql/fragments/vectorUtilities";
import {useVectorUtilities} from "src/graphql/fragments/vectorUtilities";
import {useAirspaceColors} from "src/composables/airspaces";
import AirspaceInfoWindow from "components/map/AirspaceInfoWindow.vue";
import {useFlightPlanObjects} from "src/composables/flightPlan";
@@ -117,8 +117,7 @@ const airportsOnMap = computed(() => {
return props.airports.filter(a => a.gpsLatitude && a.gpsLongitude).filter(a => a.icaoCode.length === 6 ? displayAirspaceLayers.value.FIELDSTRIP : displayAirspaceLayers.value.AIRPORTS);
});
const {isPointInPolygon, vectorDistanceToKm} = useVectorUtilities();
const {vectorDistance} = useBasicVectorOperations();
const {isPointInPolygon} = useVectorUtilities();
const getAirspacesAtCoordinates = (clickCoordinates) => {
const airspacesUnderClick = []
@@ -163,7 +162,6 @@ const handleReportingPointClick = (airport, reportingPoint) => {
const airspacesUnderClick = getAirspacesAtCoordinates(position);
highlightedAirspaces.value = [];
emitMapClick({position, airport, reportingPoint, airspaces: airspacesUnderClick})
}
@@ -173,7 +171,6 @@ const handleAirportClick = (airport) => {
const airspacesUnderClick = getAirspacesAtCoordinates(position);
highlightedAirspaces.value = [];
emitMapClick({position, airport, airspaces: airspacesUnderClick})
}
</script>
@@ -189,7 +186,7 @@ const handleAirportClick = (airport) => {
ref="mapRef"
>
<AirspaceInfoWindow
v-if="infoWindow.active"
v-if="showInfoWindow && infoWindow.active"
:info-window="infoWindow"
:highlighted-airspaces="highlightedAirspaces"
@close="infoWindow.active=false"
@@ -49,7 +49,6 @@ const {pointsOfInterest} = storeToRefs(usePointsOfInterestStore());
const {airspaces: airspacesData, areAirspacesLoading: isQueryRunning} = storeToRefs(useAirspacesStore())
const {airports} = storeToRefs(useAirportsStore());
const {aircrafts: aircraftsData} = storeToRefs(useAircraftsStore());
const {copilots: copilotsData} = storeToRefs(useCopilotsStore());
const aircrafts = computed(() => aircraftsData.value.map(a => ({id: a.id, name: a.callSign})));
@@ -58,7 +57,7 @@ const {markerObject} = useFlightPlanObjects();
const formData = ref({
name: flightPlan.value?.name || null,
isDefaultName: flightPlan.value?.isDefaultName || false,
isDefaultName: flightPlan.value ? flightPlan.value.isDefaultName : true,
isEditableByCopilot: flightPlan.value?.isEditableByCopilot || false,
isPublic: flightPlan.value?.isPublic || false,
plannedTakeoffDatetime: flightPlan.value?.plannedTakeoffDatetime || null,
@@ -70,9 +69,6 @@ const openedTab = ref("route");
const flightPlannerDialogOpen = ref(false);
const flightPlanMarkers = ref(getMarkersFrom(flightPlan.value));
const autoFlightName = computed(() => flightPlanMarkers.value.map(m => m.name).join(" - "))
const handleMarkersChanges = (markers) => {
flightPlanMarkers.value = markers;