bachir/ouatterrir-app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

display concernements with less than 3 entites

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi 2024-05-21 16:44:40 +02:00
parent 560c4eda72
commit 433383437d
1 changed files with 82 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

139
src/components/ConcernementMapItem.vue
View File

@ -103,7 +103,8 @@ export default {
// disable concernement if less than 3 entite // disable concernement if less than 3 entite
if(this.entites.length < 3){ if(this.entites.length < 3){
this.hideShowConcernement(this.concernement.id, false); this.hideShowConcernement(this.concernement.id, false);
} else{ }
// else{
// record canvas and ctx for rendering (drawing) // record canvas and ctx for rendering (drawing)
this.canvas = this.canvasMap.canvas this.canvas = this.canvasMap.canvas
this.ctx = this.canvasMap.ctx this.ctx = this.canvasMap.ctx
@ -112,7 +113,9 @@ export default {
this.ray = this.map_item_ray; this.ray = this.map_item_ray;
// console.log(`this.ray: ${this.ray}`); // console.log(`this.ray: ${this.ray}`);
// //
this.parseEntityPointsValues() this.parseEntityPointsValues();
// this.getSalientPoints() // this.getSalientPoints()
this.sailentEntites = this.concernement.sailentEntites = this.getJarvisEnvelopeConvexeEntites(this.entites) this.sailentEntites = this.concernement.sailentEntites = this.getJarvisEnvelopeConvexeEntites(this.entites)
@ -132,7 +135,7 @@ export default {
this.handleMapitemVisibility(false); this.handleMapitemVisibility(false);
} }
} }
} // }
// this.setConcernementMapItem(this.cid, this); // this.setConcernementMapItem(this.cid, this);
// this.setConcernementScale(this.cid, this.scale); // this.setConcernementScale(this.cid, this.scale);
@ -430,6 +433,7 @@ export default {
} }
} }
this.concernement.parsedEntites = true; this.concernement.parsedEntites = true;
}, },
getSalientPoints_OLD() { getSalientPoints_OLD() {
// debugger // debugger
@ -799,23 +803,25 @@ export default {
// then scale again to new size // then scale again to new size
this.paper_main_object.scale(this.details_zoom_scale); this.paper_main_object.scale(this.details_zoom_scale);
// resize entites (dim them while we zoomin) // resize entites (dim them while we zoomin)
this.paper_main_object.children['entites'].children.forEach((child) => { if(this.paper_main_object.children){
if(child.name === 'entite'){ this.paper_main_object.children['entites'].children.forEach((child) => {
// revert to the original size (by reverting the previous scale) if(child.name === 'entite'){
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) // revert to the original size (by reverting the previous scale)
label.scale(1 / prev_entite_s); child.scale(1 / prev_entite_s);
// then scale again to new size // then scale again to new size
label.scale(1 / this.details_zoom_scale); child.scale(1 / this.details_zoom_scale);
// label.children['label_txt'].fontSize = 4 / this.detailsZoomValue; }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 // allow to go through walls if zoomed in
if (this.detailsZoomValue > 1) { if (this.detailsZoomValue > 1) {
@ -875,7 +881,7 @@ export default {
this.sailentEntites = this.getJarvisEnvelopeConvexeEntites(this.concernement.revisions_byid[this.active_revision].entites); this.sailentEntites = this.getJarvisEnvelopeConvexeEntites(this.concernement.revisions_byid[this.active_revision].entites);
// remove contours if already exists // remove contours if already exists
if (this.paper_main_object.children.contours) { if (this.paper_main_object.children && this.paper_main_object.children.contours) {
this.paper_main_object.children.contours.remove(); this.paper_main_object.children.contours.remove();
} }
// redraw contours // redraw contours
@ -921,8 +927,8 @@ export default {
} }
}, },
getPaddedRoundedSegments(points, scale){ getPaddedRoundedSegments(points, scale){
// console.log(`setPaperContour ${this.concernement.id}`); console.log(`setPaperContour ${this.concernement.id}, points`, points);
let getSegmentProps = (b,a,c,d) => { let getSegmentProps = (b,a,c) => {
const ac = { x: c.x - a.x, y: c.y - a.y } // get ac vecteur const ac = { x: c.x - a.x, y: c.y - a.y } // get ac vecteur
const lac = Math.sqrt(Math.pow(ac.x, 2) + Math.pow(ac.y, 2)); // get ac longueur ac const lac = Math.sqrt(Math.pow(ac.x, 2) + Math.pow(ac.y, 2)); // get ac longueur ac
const ab = { x: b.x - a.x, y: b.y - a.y } // get ab vecteur const ab = { x: b.x - a.x, y: b.y - a.y } // get ab vecteur
@ -966,11 +972,11 @@ export default {
); );
let segments = [first_point]; let segments = [first_point];
for (let j = 1; j < points.length-1; j++) { for (let j = 1; j < points.length-1; j++) {
segments.push(getSegmentProps( segments.push(getSegmentProps(
points[j-1], points[j-1],
points[j], points[j],
points[j+1] points[j+1]
)) ))
} }
const last_point = getSegmentProps( const last_point = getSegmentProps(
points[points.length-2], points[points.length-2],
@ -985,38 +991,57 @@ export default {
setPaperContour(){ setPaperContour(){
// console.log('setPaperContour, this.sailentEntites', this.sailentEntites); // console.log('setPaperContour, this.sailentEntites', this.sailentEntites);
// convert sailent entites to x,y points // convert sailent entites to x,y points
let points = []; if (this.sailentEntites.length < 3) {
this.sailentEntites.forEach(entite => { // if we have less than 3 entities, draw a circle
points.push({ let circle = new paper.Path.Circle({
x: (entite.display.ray) * Math.cos(entite.display.alpha * (Math.PI/180)), name: 'contours',
y: (entite.display.ray) * Math.sin(entite.display.alpha * (Math.PI/180)) center: this.pos,
radius: this.ray/3,
fillColor: 'rgba(255,255,255,0.4)',
// selected: true,
strokeColor: '#fff',
strokeWidth: 1,
pivot: new paper.Point(this.pos),
// scale: this.details_zoom_scale,
cid: this.cid,
}) })
}) return circle;
// convert points to rouded and padded segments props } else {
let segments = this.getPaddedRoundedSegments(points, this.scale) // if we have more than 3 entities, draw normal contour
// create "real" Paper Segments from previous segments props let points = [];
let paper_segments = []; this.sailentEntites.forEach(entite => {
segments.forEach(seg => { points.push({
paper_segments.push(new paper.Segment({ x: (entite.display.ray) * Math.cos(entite.display.alpha * (Math.PI/180)),
point: [this.pos.x+seg.point[0]*this.details_zoom_scale, this.pos.y+seg.point[1]*this.details_zoom_scale], y: (entite.display.ray) * Math.sin(entite.display.alpha * (Math.PI/180))
handleIn: seg.handleIn, })
handleout: seg.handleOut })
})) // convert points to rouded and padded segments props
}); let segments = this.getPaddedRoundedSegments(points, this.scale)
// create the paper path with previous segments // create "real" Paper Segments from previous segments props
const contrs = new paper.Path({ let paper_segments = [];
name: 'contours', segments.forEach(seg => {
segments: paper_segments, paper_segments.push(new paper.Segment({
fillColor: 'rgba(255,255,255,0.4)', point: [this.pos.x+seg.point[0]*this.details_zoom_scale, this.pos.y+seg.point[1]*this.details_zoom_scale],
// selected: true, handleIn: seg.handleIn,
strokeColor: '#fff', handleout: seg.handleOut
strokeWidth: 1, }))
pivot: new paper.Point(this.pos), });
// scale: this.details_zoom_scale, // create the paper path with previous segments
cid: this.cid, let contrs = new paper.Path({
}); name: 'contours',
// return the paper path segments: paper_segments,
return contrs; fillColor: 'rgba(255,255,255,0.4)',
// selected: true,
strokeColor: '#fff',
strokeWidth: 1,
pivot: new paper.Point(this.pos),
// scale: this.details_zoom_scale,
cid: this.cid,
});
// return the paper path
return contrs;
}
}, },
setPaperEntites(){ setPaperEntites(){
let g = new paper.Group({ let g = new paper.Group({