started to draw doleance background boussole
This commit is contained in:
parent
c8aaf2591b
commit
b72b488b8a
@ -386,11 +386,6 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// onBeforeEngineUpdate (event) {
|
|
||||||
// if (this.opened) {
|
|
||||||
// // Matter.Body.setPosition(this.body, this.pos);
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
openClose(open) {
|
openClose(open) {
|
||||||
// console.log(`ConcernementsMapItem ${this.concernement.id} openClose: ${open}`);
|
// console.log(`ConcernementsMapItem ${this.concernement.id} openClose: ${open}`);
|
||||||
if (this.tween) {
|
if (this.tween) {
|
||||||
@ -537,7 +532,7 @@ export default {
|
|||||||
|
|
||||||
// contours
|
// contours
|
||||||
if (!this.opened
|
if (!this.opened
|
||||||
|| (this.opened && this.map_mode !== "puissancedagir")) {
|
|| (this.opened && this.map_mode !== "puissancedagir" && this.map_mode !== "doleancer")) {
|
||||||
this.drawContour();
|
this.drawContour();
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -560,7 +555,7 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.map_mode !== 'puissancedagir') {
|
if (this.map_mode !== 'puissancedagir' && this.map_mode !== 'doleancer') {
|
||||||
this.drawEntites()
|
this.drawEntites()
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -763,7 +758,92 @@ export default {
|
|||||||
this.ctx.stroke();
|
this.ctx.stroke();
|
||||||
},
|
},
|
||||||
drawDoleancerBG(){
|
drawDoleancerBG(){
|
||||||
|
var r = this.ray * this.scale; // ray
|
||||||
|
var dr = r/2; // demi ray
|
||||||
|
var d = r*2; // diameter
|
||||||
|
var pcr = 2*this.scale; // petits cercle rayon
|
||||||
|
|
||||||
|
// cercle exterieur
|
||||||
|
this.ctx.beginPath();
|
||||||
|
this.ctx.lineWidth = 2;
|
||||||
|
this.ctx.strokeStyle = `#FFF`;
|
||||||
|
this.ctx.arc(this.pos.x, this.pos.y, r, 0, 2 * Math.PI, false);
|
||||||
|
this.ctx.stroke();
|
||||||
|
|
||||||
|
// cercle interieur
|
||||||
|
this.ctx.beginPath();
|
||||||
|
this.ctx.lineWidth = 2;
|
||||||
|
this.ctx.strokeStyle = `#FFF`;
|
||||||
|
this.ctx.arc(this.pos.x, this.pos.y, dr, 0, 2 * Math.PI, false);
|
||||||
|
this.ctx.stroke();
|
||||||
|
|
||||||
|
// petit cercles
|
||||||
|
this.ctx.beginPath();
|
||||||
|
this.ctx.lineWidth = 2;
|
||||||
|
this.ctx.strokeStyle = `#FFF`;
|
||||||
|
this.ctx.arc(this.pos.x, this.pos.y - r, pcr, 0, 2 * Math.PI, false);
|
||||||
|
this.ctx.stroke();
|
||||||
|
|
||||||
|
this.ctx.beginPath();
|
||||||
|
this.ctx.lineWidth = 2;
|
||||||
|
this.ctx.strokeStyle = `#FFF`;
|
||||||
|
this.ctx.arc(this.pos.x, this.pos.y + r, pcr, 0, 2 * Math.PI, false);
|
||||||
|
this.ctx.stroke();
|
||||||
|
|
||||||
|
this.ctx.beginPath();
|
||||||
|
this.ctx.lineWidth = 2;
|
||||||
|
this.ctx.strokeStyle = `#FFF`;
|
||||||
|
this.ctx.arc(this.pos.x + r, this.pos.y, pcr, 0, 2 * Math.PI, false);
|
||||||
|
this.ctx.stroke();
|
||||||
|
|
||||||
|
this.ctx.beginPath();
|
||||||
|
this.ctx.lineWidth = 2;
|
||||||
|
this.ctx.strokeStyle = `#FFF`;
|
||||||
|
this.ctx.arc(this.pos.x - r, this.pos.y, pcr, 0, 2 * Math.PI, false);
|
||||||
|
this.ctx.stroke();
|
||||||
|
|
||||||
|
// axes
|
||||||
|
this.ctx.beginPath();
|
||||||
|
this.ctx.lineWidth = 2;
|
||||||
|
this.ctx.strokeStyle = `#FFF`;
|
||||||
|
// vertical
|
||||||
|
this.ctx.moveTo(this.pos.x, this.pos.y - r);
|
||||||
|
this.ctx.lineTo(this.pos.x , this.pos.y - dr);
|
||||||
|
this.ctx.moveTo(this.pos.x, this.pos.y + r);
|
||||||
|
this.ctx.lineTo(this.pos.x , this.pos.y + dr);
|
||||||
|
// this.ctx.moveTo(this.pos.x, this.pos.y - r);
|
||||||
|
// this.ctx.lineTo(this.pos.x , this.pos.y + r);
|
||||||
|
|
||||||
|
// horizontal
|
||||||
|
this.ctx.moveTo(this.pos.x - r, this.pos.y);
|
||||||
|
this.ctx.lineTo(this.pos.x - dr, this.pos.y);
|
||||||
|
this.ctx.moveTo(this.pos.x + r, this.pos.y);
|
||||||
|
this.ctx.lineTo(this.pos.x + dr, this.pos.y);
|
||||||
|
// this.ctx.moveTo(this.pos.x - r, this.pos.y);
|
||||||
|
// this.ctx.lineTo(this.pos.x + r, this.pos.y);
|
||||||
|
|
||||||
|
// diagonale
|
||||||
|
// https://fr.wikipedia.org/wiki/Trigonom%C3%A9trie#/media/Fichier:Unit_circle_angles_color.svg
|
||||||
|
// https://fr.wikipedia.org/wiki/Identit%C3%A9_trigonom%C3%A9trique_pythagoricienne#Preuve_utilisant_le_cercle_unit%C3%A9
|
||||||
|
// radians = degrees * (pi/180)
|
||||||
|
// degrees = radians * (180/pi)
|
||||||
|
let m,n;
|
||||||
|
m = Math.sin(45*(Math.PI/180)) * r;
|
||||||
|
n = Math.sin(45*(Math.PI/180)) * r/2;
|
||||||
|
// console.log('m', m);
|
||||||
|
this.ctx.moveTo(this.pos.x + m, this.pos.y + m);
|
||||||
|
this.ctx.lineTo(this.pos.x + n, this.pos.y + n);
|
||||||
|
//
|
||||||
|
this.ctx.moveTo(this.pos.x - m, this.pos.y + m);
|
||||||
|
this.ctx.lineTo(this.pos.x - n, this.pos.y + n);
|
||||||
|
//
|
||||||
|
this.ctx.moveTo(this.pos.x + m, this.pos.y - m);
|
||||||
|
this.ctx.lineTo(this.pos.x + n, this.pos.y - n);
|
||||||
|
//
|
||||||
|
this.ctx.moveTo(this.pos.x - m, this.pos.y - m);
|
||||||
|
this.ctx.lineTo(this.pos.x - n, this.pos.y - n);
|
||||||
|
|
||||||
|
this.ctx.stroke();
|
||||||
},
|
},
|
||||||
drawDoleanceSteps(){
|
drawDoleanceSteps(){
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user