Parkingspot Edit
This commit is contained in:
parent
7f3bdc8de8
commit
9a59509638
@ -4,8 +4,8 @@
|
||||
<EditButton icon="fas fa-undo" v-on:click="undo" :show="editing" tooltip="Undo"></EditButton>
|
||||
<EditButton icon="fas fa-save" v-on:click="save" :show="editing" tooltip="Save"></EditButton>
|
||||
|
||||
<EditButton icon="fas fa-draw-polygon" :show="editing" tooltip="Draw Taxiline"></EditButton>
|
||||
<EditButton icon="fas fas fa-parking" :show="editing" tooltip="Draw Parking"></EditButton>
|
||||
<EditButton icon="fas fa-draw-polygon" v-on:click="drawPolyline" :show="editing" tooltip="Draw Taxiline"></EditButton>
|
||||
<EditButton icon="fas fas fa-parking" v-on:click="drawParking" :show="editing" tooltip="Draw Parking"></EditButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -30,6 +30,12 @@
|
||||
save () {
|
||||
this.editing = false
|
||||
this.$parent.$parent.$refs.editLayer.disableEdit()
|
||||
},
|
||||
drawPolyline () {
|
||||
this.$parent.$parent.$refs.editLayer.drawPolyline()
|
||||
},
|
||||
drawParking () {
|
||||
this.$parent.$parent.$refs.editLayer.drawParking()
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
@ -8,7 +8,7 @@
|
||||
import { LMap, LMarker } from 'vue2-leaflet'
|
||||
import L from 'leaflet'
|
||||
import LEdit from 'leaflet-editable/src/Leaflet.Editable.js'
|
||||
import {readGroundnetXML} from '../loaders/groundnet_loader'
|
||||
import {readGroundnetXML, addFeature} from '../loaders/groundnet_loader'
|
||||
|
||||
export default {
|
||||
name: 'edit-layer',
|
||||
@ -26,6 +26,7 @@
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
maxId: 1
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@ -34,6 +35,8 @@
|
||||
this.groundnet.removeFrom(this.$parent.mapObject)
|
||||
}
|
||||
this.groundnet = readGroundnetXML(this.$store.state.Settings.settings.airportsDirectory, icao)
|
||||
console.log(this.groundnet.maxId)
|
||||
|
||||
this.groundnet.addTo(this.$parent.mapObject)
|
||||
},
|
||||
visible (feature) {
|
||||
@ -73,6 +76,27 @@
|
||||
this.groundnet.eachLayer(l => {
|
||||
l.disableEdit()
|
||||
})
|
||||
},
|
||||
drawPolyline () {
|
||||
this.$parent.mapObject.editTools.startPolyline()
|
||||
},
|
||||
drawParking () {
|
||||
this.$parent.mapObject.on('click', this.addParking)
|
||||
},
|
||||
addParking (event) {
|
||||
console.log(event.latlng)
|
||||
if (event.latlng === undefined) {
|
||||
return
|
||||
}
|
||||
const circle = new L.ParkingSpot(event.latlng, {attributes: {radius: 20, heading: 0}})
|
||||
circle.id = (++this.groundnet.maxId)
|
||||
circle.addTo(this.groundnet)
|
||||
circle.enableEdit()
|
||||
circle.extensions()
|
||||
circle.addListeners()
|
||||
addFeature(circle)
|
||||
// console.log(this.groundnet)
|
||||
this.$parent.mapObject.off('click', this.addParking)
|
||||
}
|
||||
|
||||
},
|
||||
@ -88,7 +112,4 @@
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.edit-layer {
|
||||
|
||||
}
|
||||
</style>
|
||||
|
@ -22,13 +22,11 @@ L.ParkingSpot = L.Circle.extend({
|
||||
}
|
||||
this.direction = L.polyline([start, this.turfToLatLng(end)]);
|
||||
this.direction.addTo(this.editor.editLayer);
|
||||
|
||||
|
||||
this.on('editable:drawing:move', function (event) {
|
||||
this.updateDirectionFromVertex();
|
||||
});
|
||||
}
|
||||
},
|
||||
removeDirection: function () {
|
||||
this.direction = undefined;
|
||||
},
|
||||
//
|
||||
updateVertexFromDirection: function () {
|
||||
if (this.editEnabled()) {
|
||||
@ -50,9 +48,34 @@ L.ParkingSpot = L.Circle.extend({
|
||||
var end = this.editor._resizeLatLng.__vertex.getLatLng();
|
||||
var heading = turf.bearing([start.lng, start.lat], [end.lng, end.lat]);
|
||||
this.options.attributes.heading = heading + 180;
|
||||
this.options.attributes.radius = this._mRadius;
|
||||
this.direction.setLatLngs([start, end]);
|
||||
}
|
||||
},
|
||||
addListeners: function () {
|
||||
this.on('editable:drawing:move', function (event) {
|
||||
console.log("Move : ", event);
|
||||
// Is it the edit vertex (Middle) moving?
|
||||
if(event.target.editor._resizeLatLng.__vertex._icon !== event.sourceTarget._element){
|
||||
follow(event.target.id, event);
|
||||
event.target.updateVertexFromDirection();
|
||||
}
|
||||
else if(event.target.editor._resizeLatLng.__vertex._icon === event.sourceTarget._element) {
|
||||
event.target.updateDirectionFromVertex();
|
||||
console.log(event);
|
||||
}
|
||||
});
|
||||
this.on('editable:vertex:drag', function (event) {
|
||||
console.log("Drag : ", event);
|
||||
});
|
||||
this.on('click', function (event) {
|
||||
console.log("Click : " + event.target);
|
||||
store.default.dispatch('setParking', event.target.options.attributes);
|
||||
});
|
||||
this.on('editable:disable', function (event) {
|
||||
event.target.removeDirection();
|
||||
});
|
||||
},
|
||||
turfToLatLng: function (turfPoint) {
|
||||
return {lat: turfPoint.geometry.coordinates[1], lng: turfPoint.geometry.coordinates[0]};
|
||||
},
|
||||
@ -71,7 +94,6 @@ L.ParkingSpot = L.Circle.extend({
|
||||
});
|
||||
|
||||
var parkingSpot = function (n, layerGroup) {
|
||||
|
||||
//console.log(n.attr('lat') + " " + n.attr('lon'));
|
||||
var latlon = convert(n.attr('lat') + " " + n.attr('lon'));
|
||||
//console.log(latlon.decimalLatitude);
|
||||
@ -102,7 +124,9 @@ airlineCodes="VIR,KAL,DAL,KLM" />
|
||||
circle.options.attributes[ key ] = value;
|
||||
else
|
||||
circle.options.attributes[ key ] = Number( value);
|
||||
});
|
||||
});
|
||||
circle.addListeners();
|
||||
|
||||
circle.addTo(layerGroup);
|
||||
return circle;
|
||||
}
|
||||
|
@ -17,9 +17,14 @@ var $ = require('jquery');
|
||||
|
||||
var featureLookup = {};
|
||||
|
||||
exports.addFeature = function (feature) {
|
||||
featureLookup[feature.id] = new Array();
|
||||
}
|
||||
|
||||
exports.readGroundnetXML = function (fDir, icao) {
|
||||
try {
|
||||
try {
|
||||
layerGroup = L.layerGroup();
|
||||
layerGroup.maxId = 0;
|
||||
var f = path.join(fDir, icao[0], icao[1], icao[2], icao + '.groundnet.xml');
|
||||
|
||||
if (f == null || !fs.existsSync(f))
|
||||
@ -46,31 +51,11 @@ exports.readGroundnetXML = function (fDir, icao) {
|
||||
var nodesLookup = {};
|
||||
|
||||
parkingNodes.map(n => {
|
||||
var circle = parkingSpot(n, layerGroup);
|
||||
circle.on('editable:drawing:move', function (event) {
|
||||
// console.log("Follow 1: " + event.sourceTarget );
|
||||
// console.log("Follow 2: " + event.sourceTarget._dragStartTarget );
|
||||
// console.log("Follow 3: " + event.target.editor._resizeLatLng.__vertex );
|
||||
// console.log("Follow 4: " + event.target.editor._resizeLatLng.__vertex._icon );
|
||||
// console.log("Follow 5: " + (event.target.editor._resizeLatLng.__vertex === event.sourceTarget) );
|
||||
// console.log("Follow 6: " + (event.target.editor._resizeLatLng.__vertex._icon === event.sourceTarget._element) );
|
||||
// console.log("Follow 7: " + (event.target.editor._resizeLatLng.__vertex._icon === event.sourceTarget._dragStartTarget) );
|
||||
// console.log("Follow 8: " + (event.target.editor._resizeLatLng.__vertex._icon._leaflet_id === event.sourceTarget._dragStartTarget._leaflet_id) );
|
||||
|
||||
// Is it the edit vertex moving?
|
||||
if(event.target.editor._resizeLatLng.__vertex._icon !== event.sourceTarget._element){
|
||||
follow(event.target.id, event);
|
||||
}
|
||||
});
|
||||
circle.on('click', function (event) {
|
||||
console.log("Click : " + event.target);
|
||||
store.default.dispatch('setParking', event.target.options.attributes);
|
||||
});
|
||||
|
||||
var circle = parkingSpot(n, layerGroup);
|
||||
nodesLookup[n.attr('index')] = n;
|
||||
featureLookup[n.attr('index')] = new Array();
|
||||
featureLookup[n.attr('index')].push(circle);
|
||||
|
||||
layerGroup.maxId = Math.max(layerGroup.maxId, Number(n.attr('index')))
|
||||
features.push(circle);
|
||||
}).sort();
|
||||
// Get all nodes into the lookup
|
||||
@ -81,6 +66,7 @@ exports.readGroundnetXML = function (fDir, icao) {
|
||||
var latlon = convert(n.attr('lat') + " " + n.attr('lon'));
|
||||
//console.log(latlon.decimalLatitude);
|
||||
|
||||
layerGroup.maxId = Math.max(layerGroup.maxId, Number(n.attr('index')))
|
||||
nodesLookup[n.attr('index')] = n;
|
||||
}).sort();
|
||||
|
||||
@ -207,7 +193,8 @@ follow = function (dragIndex, event) {
|
||||
if (element instanceof L.ParkingSpot) {
|
||||
element.disableEdit();
|
||||
element.setLatLng(event.latlng);
|
||||
// element.enableEdit();
|
||||
element.enableEdit();
|
||||
element.extensions();
|
||||
element.updateVertexFromDirection();
|
||||
}
|
||||
else if (element instanceof L.TaxiwaySegment) {
|
||||
|
Loading…
Reference in New Issue
Block a user