diff --git a/src/api/gql/concernement.fragment.gql b/src/api/gql/concernement.fragment.gql index f956b13..378b67a 100644 --- a/src/api/gql/concernement.fragment.gql +++ b/src/api/gql/concernement.fragment.gql @@ -51,6 +51,7 @@ fragment ConcernementFields on Concernement { actuelfuture entite { id + title agissante proximite { id diff --git a/src/components/ConcernementMapItem.vue b/src/components/ConcernementMapItem.vue index 3f49ec8..6e5ce4b 100644 --- a/src/components/ConcernementMapItem.vue +++ b/src/components/ConcernementMapItem.vue @@ -716,11 +716,22 @@ export default { // then scale again to new size this.paper_main_object.scale(this.details_zoom_scale); // resize entites (dim them while we zoomin) - this.paper_main_object.children['entites'].children.forEach((entite) => { - // revert to the original size (by reverting the previous scale) - entite.scale(1 / prev_entite_s); - // then scale again to new size - entite.scale(1 / this.details_zoom_scale); + this.paper_main_object.children['entites'].children.forEach((child) => { + if(child.name === 'entite'){ + // revert to the original size (by reverting the previous scale) + child.scale(1 / prev_entite_s); + // then scale again to new size + child.scale(1 / this.details_zoom_scale); + }else if(child.name === 'entites_labels'){ + child.opacity = -2 + this.detailsZoomValue; + child.children.forEach((label) => { + // revert to the original size (by reverting the previous scale) + label.scale(1 / prev_entite_s); + // then scale again to new size + label.scale(1 / this.details_zoom_scale); + // label.children['label_txt'].fontSize = 4 / this.detailsZoomValue; + }) + } }); // allow to go through walls if zoomed in @@ -912,6 +923,13 @@ export default { pivot: new paper.Point(this.pos), name: 'entites' }); + let g_label = new paper.Group({ + pivot: new paper.Point(this.pos), + name: 'entites_labels', + opacity: 0 + }); + g.addChild(g_label); + g_label.sendToBack(); // for (let i = 0; i < this.entites.length; i++) { for (let i = 0; i < this.concernement.revisions_byid[this.concernement.active_revision].entites.length; i++) { let entite = this.concernement.revisions_byid[this.concernement.active_revision].entites[i]; @@ -937,13 +955,51 @@ export default { let instance = new paper.SymbolItem(this.paper_symbol_definitions[symbol_name]); instance.name = 'entite'; - instance.position = new paper.Point([this.pos.x + entite.display.pos.x * this.scale, this.pos.y + entite.display.pos.y * this.scale]); + let pos_point = new paper.Point([this.pos.x + entite.display.pos.x * this.scale, this.pos.y + entite.display.pos.y * this.scale]); + instance.position = pos_point; instance.scale(this.scale); instance.fillColor = '#000'; instance.item_id = entite.entite ? entite.entite.id : null; instance.item_type = item_type; instance.is_symbol_instance = true; - g.addChild(instance) + g.addChild(instance); + // instance.bringToFront(); + + if (entite.entite && entite.entite.title) { + let pad = 2; + let label_pos = new paper.Point({ + x: pos_point.x + pad, + y: pos_point.y - pad*2 + }); + let label = new paper.Group({ + pivot: pos_point, + name: 'label', + }); + + + let title = entite.entite.title; + title = (title.length > 25) ? title.slice(0, 25 - 1) + '…' : title; + let label_txt = new paper.PointText({ + pivot: pos_point, + point: label_pos, + content: title, + fillColor: 'black', + fontFamily: 'public_sans', + fontSize: 4, + justification: 'left', + name: 'label_txt' + }) + let b = label_txt.bounds; + let label_bg = new paper.Path.Rectangle(b.x - pad, b.y - pad, b.width + pad*2, b.height + pad*2); + label_bg.fillColor = '#fff'; + label_bg.opacity = 0.9; + label_bg.name = 'label_bg'; + + label.addChild(label_bg); + label_txt.insertAbove(label_bg) + // label.sendToBack(); + g_label.addChild(label); + } } return g; }, @@ -2017,6 +2073,10 @@ export default { } else { document.body.style.cursor = "auto"; } + + if (result && (result.item.name === 'label_txt' || result.item.name === 'label_bg')) { + result.item.parent.bringToFront(); + } } } }.bind(this); diff --git a/src/components/contents/TerrainDeVie.vue b/src/components/contents/TerrainDeVie.vue index 16d74d6..2032e1e 100644 --- a/src/components/contents/TerrainDeVie.vue +++ b/src/components/contents/TerrainDeVie.vue @@ -265,7 +265,7 @@ export default { >
- +