|
@@ -30,6 +30,9 @@ export default {
|
|
|
this.entites = this.concernement.entites
|
|
|
this.parsePoints()
|
|
|
this.getSalientPoints()
|
|
|
+ if (this.canvasMap) {
|
|
|
+ this.initCanvasMap()
|
|
|
+ }
|
|
|
},
|
|
|
watch: {
|
|
|
// canvasMap (n, o) {
|
|
@@ -37,19 +40,25 @@ export default {
|
|
|
// }
|
|
|
canvasMap: {
|
|
|
handler (n, o){
|
|
|
- // console.log("concernementItem watch canvasMap.ctx", o, n);
|
|
|
- this.canvas = this.canvasMap.canvas
|
|
|
- this.ctx = this.canvasMap.ctx
|
|
|
- this.pos.x = this.ray/2 + Math.random()*(this.canvas.width - this.ray)
|
|
|
- this.pos.y = this.ray/2 + Math.random()*(this.canvas.height - this.ray)
|
|
|
- // listen for animate event dispatched from parent
|
|
|
- this.canvas.addEventListener('animate', this.animate)
|
|
|
+ console.log("concernementItem watch canvasMap.ctx", o, n);
|
|
|
+ if (!this.canvas) {
|
|
|
+ this.initCanvasMap()
|
|
|
+ }
|
|
|
},
|
|
|
deep: true
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ initCanvasMap (){
|
|
|
+ this.canvas = this.canvasMap.canvas
|
|
|
+ this.ctx = this.canvasMap.ctx
|
|
|
+ this.pos.x = this.ray/2 + Math.random()*(this.canvas.width - this.ray)
|
|
|
+ this.pos.y = this.ray/2 + Math.random()*(this.canvas.height - this.ray)
|
|
|
+ // listen for animate event dispatched from parent
|
|
|
+ this.canvas.addEventListener('animate', this.animate)
|
|
|
+ },
|
|
|
parsePoints (){
|
|
|
+ // converts data (menace/maintien, actuel/future, prise) into atcual position x,y
|
|
|
for (let i = 0; i < this.entites.length; i++) {
|
|
|
let entite = this.entites[i]
|
|
|
// console.log('entite', entite);
|
|
@@ -88,7 +97,7 @@ export default {
|
|
|
getSalientPoints () {
|
|
|
// debugger
|
|
|
// console.log(this.entites);
|
|
|
- let arc = 60;
|
|
|
+ let arc = 360/12;
|
|
|
// loop through arcs
|
|
|
for (let i = 0; i <= 360/arc; i++) {
|
|
|
// loop through entities to find the farest on the arc
|
|
@@ -109,7 +118,7 @@ export default {
|
|
|
this.salientPoints.push(farest.display)
|
|
|
}
|
|
|
}
|
|
|
- // console.log('this.salientPoints', this.salientPoints);
|
|
|
+ console.log(`this.salientPoints ${this.concernement.id}`, this.salientPoints);
|
|
|
},
|
|
|
animate () {
|
|
|
if (this.ctx) {
|
|
@@ -120,7 +129,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
render() {
|
|
|
- // console.log('render()');
|
|
|
+ // console.log('render()', this.ctx);
|
|
|
|
|
|
if (!this.ctx) return;
|
|
|
|