diff --git a/src/renderer/components/EditLayer.vue b/src/renderer/components/EditLayer.vue index 5ac564f..6f15642 100644 --- a/src/renderer/components/EditLayer.vue +++ b/src/renderer/components/EditLayer.vue @@ -139,7 +139,10 @@ You should have received a copy of the GNU General Public License along with FG } this.groundnetLayerGroup.eachLayer(l => { if (l instanceof L.TaxiwaySegment) { - l.addListeners() + l.addListeners() + } + if (l.updateArrows !== undefined) { + l.updateArrows(this.$store.state.Settings.zoom) } }) console.log(this.groundnetLayerGroup.maxId) diff --git a/src/renderer/components/FlightgearMap.vue b/src/renderer/components/FlightgearMap.vue index a723f00..473d276 100644 --- a/src/renderer/components/FlightgearMap.vue +++ b/src/renderer/components/FlightgearMap.vue @@ -327,6 +327,11 @@ You should have received a copy of the GNU General Public License along with FG this.$refs.airportLayer.setVisible(zoom < 12) this.$refs.pavementLayer.setVisible(zoom >= 12) } + this.$refs.editLayer.groundnetLayerGroup.eachLayer(function (layer) { + if (layer.updateArrows !== undefined) { + layer.updateArrows(zoom) + } + }) }, async centerUpdated (center) { if (center !== this.$store.state.Settings.center) { diff --git a/src/renderer/loaders/TaxiwaySegmentExtender.js b/src/renderer/loaders/TaxiwaySegmentExtender.js index d048ef9..0ae0130 100644 --- a/src/renderer/loaders/TaxiwaySegmentExtender.js +++ b/src/renderer/loaders/TaxiwaySegmentExtender.js @@ -485,8 +485,35 @@ const extendTaxiSegment = function (taxiwaySegment) { }) }; + taxiwaySegment.__proto__.updateArrows = function (zoom) { + if (this.options.attributes.direction === 'forward') { + this.setText(null); + if (zoom <= 16) { + this.setText(' >', { repeat: true, offset: 6, attributes: { fill: 'red', style: 'vertical-align: bottom; vertical-align: bottom; font-weight: bold; font: bold 15px serif;' } }) + } else if (zoom <= 19 ) { + this.setText(' > ', { repeat: true, offset: 7, attributes: { fill: 'red', style: 'vertical-align: bottom; vertical-align: bottom; font-weight: bold; font: bold 20px serif;' } }) + } else { + this.setText(' > ', { repeat: true, offset: 10, attributes: { fill: 'red', style: 'vertical-align: bottom; vertical-align: bottom; font-weight: bold; font: bold 30px serif;' } }) + } + } else if (this.options.attributes.direction === 'backward') { + this.setText(null); + if (zoom <= 16) { + this.setText(' <', { repeat: true, offset: 6, attributes: { fill: 'red', style: 'vertical-align: bottom; vertical-align: bottom; font-weight: bold; font: bold 15px serif;' } }) + } else if (zoom <= 19 ) { + this.setText(' < ', { repeat: true, offset: 7, attributes: { fill: 'red', style: 'vertical-align: bottom; vertical-align: bottom; font-weight: bold; font: bold 20px serif;' } }) + } else { + this.setText(' < ', { repeat: true, offset: 10, attributes: { fill: 'red', style: 'vertical-align: bottom; vertical-align: bottom; font-weight: bold; font: bold 30px serif;' } }) + } + } else { + this.setText(null); + } + } + taxiwaySegment.__proto__.updateStyle = function () { var style = {}; + if(!this.options.attributes) { + return; + } if (this.options.attributes.selected) { style.color = 'red'; } else if (this.options.attributes.isPushBackRoute) { @@ -499,10 +526,10 @@ const extendTaxiSegment = function (taxiwaySegment) { if (this._map !== null) { if (this.options.attributes.direction === 'forward') { this.setText(null); - this.setText(' > ', { repeat: true, offset: 10, attributes: { fill: 'red', style: 'vertical-align: bottom; vertical-align: bottom; font-weight: bold; font: bold 30px serif;' } }) + this.setText(' > ', { repeat: true, offset: 10, attributes: { fill: 'red', style: 'vertical-align: bottom; vertical-align: bottom; font-weight: bold; font: bold 30px serif;' } }) } else if (this.options.attributes.direction === 'backward') { this.setText(null); - this.setText(' < ', { repeat: true, offset: 10, attributes: { fill: 'red', style: 'vertical-align: bottom; font-weight: bold; font: bold 30px serif;' } }) + this.setText(' < ', { repeat: true, offset: 10, attributes: { fill: 'red', style: 'vertical-align: bottom; vertical-align: bottom; font-weight: bold; font: bold 30px serif;' } }) } else { this.setText(null); }