FGFS-4.1/flightgear-airports-old
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

RunwayNode adding

Browse Source
This commit is contained in:
portree_kid 2020-02-02 23:05:49 +01:00
parent 806253dfb6
commit 79088be6f6
6 changed files with 198 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
src/renderer/components/EditLayer.vue
View File

@ -28,6 +28,25 @@
// console.log(LSymbol)
},
mounted () {
this.selectionLayerGroup = L.layerGroup();
this.selectionLayerGroup.addTo(this.$parent.mapObject)
this.$store.watch(
function (state) {
return state.Editable.data.node;
},
() => { this.editedNode() }
/*
(newValue, oldValue) => {
console.log(`Updating from ${oldValue} to ${newValue}`);
//console.log(this.featureLookup[newValue.index]);
console.log(this.component('editLayer'));
//do something on data change
}*/
,
{
deep: true //add this if u need to watch object properties change etc.
}
);
},
beforeDestroy () {
this.remove()
@ -42,6 +61,8 @@
if (this.groundnetLayerGroup !== undefined) {
this.groundnetLayerGroup.removeFrom(this.$parent.mapObject)
}
this.icao = icao
this.groundnetLayerGroup = readGroundnetXML(this.$store.state.Settings.settings.airportsDirectory, icao, force)
if (this.groundnetLayerGroup === undefined) {
@ -109,7 +130,6 @@
l.bringToFront()
}
})
},
disableEdit () {
this.editable = false
@ -150,6 +170,45 @@
event.target.addTo(this.groundnetLayerGroup)
})
},
editedNode() {
var isOnRunway = this.$store.state.Editable.data.node.isOnRunway;
var nIndex = this.$store.state.Editable.index;
var hasRunwayNode = false;
var latlng;
this.featureLookup[nIndex].forEach((element,index) => {
if (element instanceof L.RunwayNode) {
if (isOnRunway === 0) {
// We shouldn't have a RunwayNode
element.removeFrom(layerGroup);
this.featureLookup[nIndex].splice(index,1);
}
hasRunwayNode = true;
}
else if (element instanceof L.ParkingSpot) {
}
else if (element instanceof L.TaxiwaySegment) {
if (Number(element.begin) === nIndex) {
latlng = element._latlngs[0];
}
if (Number(element.end) === nIndex) {
latlng = element._latlngs[1];
}
}
})
if (!hasRunwayNode && isOnRunway) {
const icon = new L.DivIcon({
className: 'custom-div-icon',
html: "<div style='background-color:#4838cc;' class='marker-pin'></div><i class='fas fa-plane-departure'></i>",
iconSize: [30, 42],
iconAnchor: [15, 42]
});
const node = new L.RunwayNode(latlng, { icon: icon });
node.glueindex = nIndex;
node.addTo(layerGroup);
this.featureLookup[nIndex].push(node);
node.addListeners();
}
},
closestLayerSnap (eventLatlng, snap) {
var layers = []
this.groundnetLayerGroup.eachLayer((layer) => {

8
src/renderer/components/LeafletSidebar.vue
View File

@ -4,7 +4,7 @@
<div class="leaflet-sidebar-tabs">
<ul role="tablist"> <!-- top aligned tabs -->
<li><a href="#home" role="tab"><i class="fa fa-bars"></i></a></li>
<li><a href="#airports" role="tab"><i class="fas fa-edit"></i></a></li>
<li><a href="#edit" role="tab"><i class="fas fa-edit"></i></a></li>
<li><a href="#scan" role="tab"><i class="fa fa-search"></i></a></li>
</ul>
@ -22,10 +22,11 @@
</h1>
<p>A responsive sidebar for mapping libraries</p>
</div>
<div class="leaflet-sidebar-pane" id="airports">
<div class="leaflet-sidebar-pane" id="edit">
<AirportEdit></AirportEdit>
<GroundnetEdit></GroundnetEdit>
<ArcEdit></ArcEdit>
<NodeEdit></NodeEdit>
</div>
<div class="leaflet-sidebar-pane" id="scan">
<RunScan></RunScan>
@ -45,13 +46,14 @@
import AirportEdit from './AirportEdit'
import GroundnetEdit from './GroundnetEdit'
import ArcEdit from './ArcEdit'
import NodeEdit from './NodeEdit'
import SettingsPanel from './SettingsPanel'
import RunScan from './RunScan'
import FileSelect from './FileSelect'
export default {
name: 'leaflet-sidebar',
components: { AirportEdit, ArcEdit, GroundnetEdit, SettingsPanel, RunScan, FileSelect },
components: { AirportEdit, ArcEdit, NodeEdit, GroundnetEdit, SettingsPanel, RunScan, FileSelect },
props: [],
mounted () {
this.add()

81
src/renderer/components/NodeEdit.vue Normal file
View File

@ -0,0 +1,81 @@
<template>
<div>
<h1 class="leaflet-sidebar-header" v-if="node">
Node Properties
<div class="leaflet-sidebar-close">
<i class="fa fa-caret-left"></i>
</div>
</h1>
<div width="100%" v-if="node">
<div>
<el-row>
<el-col :span="7">
<span class="demo-input-label">Is on runway :</span>
</el-col>
<el-col :span="15">
<el-switch v-model="isOnRunway"></el-switch>
</el-col>
</el-row>
<el-row>
<el-col :span="7">
<span class="demo-input-label">Holdpoint Type :</span>
</el-col>
<el-col :span="15">
<el-select v-model="holdPointType" placeholder="Select">
<el-option
v-for="type in options"
:key="type.value"
:label="type.label"
:value="type.value"
></el-option>
</el-select>
</el-col>
</el-row>
</div>
</div>
</div>
</template>
<script lang="js">
export default {
/*
methods: {
updateIsOnRunway (value) {
this.$store.commit('SET_EDIT_ISONRUNWAY', value)
}
},
*/
computed: {
options: function () {
return [{value: 'node', label: 'node'}, {value: 'PushBack', label: 'PushBack'}, {value: 'normal', label: 'normal'}, {value: 'CAT II/III', label: 'CAT II/III'}]
},
node: function () {
return this.$store.state.Editable.type === 'node'
},
// {index: 39, lat: "N58 27.343", lon: "W03 5.153", isOnRunway: 0, holdPointType: "none"}
isOnRunway: {
// getter
get: function () {
return this.$store.state.Editable.data.node.isOnRunway === 1
},
// setter
set: function (newValue) {
this.$store.commit('SET_EDIT_ISONRUNWAY', newValue ? 1 : 0)
}
},
holdPointType: {
// getter
get: function () {
if (this.$store.state.Editable.data.node.holdPointType === undefined) {
return 'none'
}
return this.$store.state.Editable.data.node.holdPointType
},
// setter
set: function (newValue) {
this.$store.commit('SET_EDIT_HOLDPOINTTYPE', newValue)
}
}
}
}
</script>

37
src/renderer/loaders/TaxiwaySegment.js
View File

@ -8,20 +8,20 @@ L.TaxiwaySegment = L.Polyline.extend({
end: String,
bidirectional: Boolean,
updateBeginVertex : function (latlng) {
updateBeginVertex: function (latlng) {
if (this._latlngs[0].__vertex) {
this._latlngs[0].__vertex.setLatLng(latlng);
}
},
updateEndVertex : function (latlng) {
if(this._latlngs[1].__vertex){
updateEndVertex: function (latlng) {
if (this._latlngs[1].__vertex) {
this._latlngs[1].__vertex.setLatLng(latlng);
}
},
updateMiddle: function () {
this._latlngs.forEach(element => {
if(element.__vertex.middleMarker){
if (element.__vertex.middleMarker) {
element.__vertex.middleMarker.updateLatLng();
}
});
@ -42,6 +42,7 @@ L.TaxiwaySegment = L.Polyline.extend({
this.on('click', function (event) {
console.log("Click : " + event.target);
store.default.dispatch('setArc', event.target.options.attributes);
});
this.on('editable:drawing:move', function (event) {
console.log(event.target);
@ -49,13 +50,19 @@ L.TaxiwaySegment = L.Polyline.extend({
this.follow(dragIndex, event);
}
});
this.on('editable:vertex:clicked', function (event) {
console.log(this.featureLookup[event.vertex.glueindex]);
store.default.dispatch('setNode', event.vertex.latlng.attributes)
event.vertex._icon.style['background-color'] = 'red';
});
var dragIndex = -1;
this.on('editable:vertex:dragstart', function (event) {
console.log("Event Target : ", event.target);
console.log("Middle Marker : ", event.vertex == event.vertex.middleMarker);
console.log("Middle Marker : ", event.vertex.glueindex == undefined);
if(event.vertex.glueindex == undefined)
return;
if (event.vertex.glueindex == undefined)
return;
dragIndex = event.vertex.glueindex;
});
this.on('editable:vertex:dragend', function (event) {
@ -71,13 +78,13 @@ L.TaxiwaySegment = L.Polyline.extend({
dragIndex = -1;
});
},
/**
*
*/
/**
*
*/
follow (dragIndex, event) {
follow(dragIndex, event) {
this.featureLookup[dragIndex].forEach(element => {
if(element !== event.target){
if (element !== event.target) {
if (element instanceof L.RunwayNode) {
element.setLatLng(event.latlng);
}
@ -107,8 +114,8 @@ L.TaxiwaySegment = L.Polyline.extend({
element.setLatLng(event.latlng);
element.latlngs.forEach((latlng, index) => {
console.log(latlng);
if(latlng.__vertex === element) {
latlng.update(event.latlng);
if (latlng.__vertex === element) {
latlng.update(event.latlng);
}
});
element.editor.feature.setLatLngs(element.latlngs);
@ -122,12 +129,12 @@ L.TaxiwaySegment = L.Polyline.extend({
updateStyle() {
var style = {};
if (this.options.attributes.isPushBackRoute) {
style.color = 'magenta';
style.color = 'magenta';
}
console.log("isPushBackRoute ", this.options.attributes.isPushBackRoute);
this.setStyle(style);
if (!this.bidirectional) {
this.setText(' ► ', {repeat: true, attributes: {fill: 'red', size: 20}})
this.setText(' ► ', { repeat: true, attributes: { fill: 'red', size: 20 } })
}
}
});

20
src/renderer/loaders/groundnet_loader.js
View File

@ -72,6 +72,7 @@ exports.readGroundnetXML = function (fDir, icao, force) {
//console.log(latlon.decimalLatitude);
layerGroup.maxId = Math.max(layerGroup.maxId, Number(n.attr('index')))
nodesLookup[n.attr('index')] = n;
if (n.attr('isOnRunway') === '1') {
var rNode = runwayNode(n, layerGroup);
@ -80,15 +81,16 @@ exports.readGroundnetXML = function (fDir, icao, force) {
}
featureLookup[rNode.glueindex].push(rNode);
}
//store.default.dispatch('setNode', n)
}).sort();
var taxiArcs = xml.find('groundnet/TaxiWaySegments/arc');
taxiArcs.map(n => {
var begin = nodesLookup[n.attr('begin')];
var end = nodesLookup[n.attr('end')];
if (typeof begin !== 'undefined' && typeof end !== 'undefined') {
var beginNode = nodesLookup[n.attr('begin')];
var endNode = nodesLookup[n.attr('end')];
if (typeof beginNode !== 'undefined' && typeof endNode !== 'undefined') {
var bidirectional = false;
if (typeof featureLookup[n.attr('begin')] !== 'undefined') {
featureLookup[n.attr('begin')].forEach(element => {
@ -107,11 +109,11 @@ exports.readGroundnetXML = function (fDir, icao, force) {
});
}
if (!bidirectional) {
var beginlatlon = convert(begin.attr('lat') + " " + begin.attr('lon'));
var endlatlon = convert(end.attr('lat') + " " + end.attr('lon'));
var beginlatlon = convert(beginNode.attr('lat') + " " + beginNode.attr('lon'));
var endlatlon = convert(endNode.attr('lat') + " " + endNode.attr('lon'));
var polyline = new L.TaxiwaySegment([[beginlatlon.decimalLatitude, beginlatlon.decimalLongitude], [endlatlon.decimalLatitude, endlatlon.decimalLongitude]], { attributes: {} }).addTo(layerGroup);
polyline._latlngs[0].attributes = {};
$.each(begin.attrs, function (key, value) {
$.each(beginNode.attrs, function (key, value) {
console.log(key + "\t" + value);
if (isNaN(value))
@ -120,7 +122,7 @@ exports.readGroundnetXML = function (fDir, icao, force) {
polyline._latlngs[0].attributes[key] = Number(value);
});
polyline._latlngs[1].attributes = {};
$.each(end.attrs, function (key, value) {
$.each(endNode.attrs, function (key, value) {
console.log(key + "\t" + value);
if (isNaN(value))
@ -138,8 +140,8 @@ exports.readGroundnetXML = function (fDir, icao, force) {
});
polyline.updateStyle();
polyline.begin = begin.attr('index');
polyline.end = end.attr('index');
polyline.begin = beginNode.attr('index');
polyline.end = endNode.attr('index');
// polyline.enableEdit();
// polyline.on('dblclick', function (event) { L.DomEvent.stop; polyline.toggleEdit; });

10
src/renderer/store/modules/Editable.js
View File

@ -1,7 +1,7 @@
const state = {
type: 'none',
index: 'none',
data: {airports: {}, parking: {}, arc: {}, nodes: {}}
data: {airports: {}, parking: {}, arc: {}, node: {}}
}
const SET_EDIT_AIRPORT = 'SET_EDIT_AIRPORT'
@ -20,7 +20,7 @@ const mutations = {
state.type = 'parking'
},
'SET_EDIT_NODE' (state, node) {
state.data.nodes[node.index] = node
state.data.node = node
state.index = node.index
state.type = 'node'
},
@ -30,6 +30,12 @@ const mutations = {
},
'SET_EDIT_PARKING_NAME' (state, parkingName) {
state.data.name = parkingName
},
'SET_EDIT_HOLDPOINTTYPE' (state, holdPointType) {
state.data.node.holdPointType = holdPointType
},
'SET_EDIT_ISONRUNWAY' (state, isOnRunway) {
state.data.node.isOnRunway = isOnRunway
}
}