better sailent point definition
This commit is contained in:
parent
f59a8b9b53
commit
d9690ee4c1
161
package-lock.json
generated
161
package-lock.json
generated
@ -16,6 +16,7 @@
|
||||
"matter-attractors": "^0.1.6",
|
||||
"matter-js": "^0.19.0",
|
||||
"pinia": "^2.0.21",
|
||||
"poly-decomp": "^0.3.0",
|
||||
"vue": "^3.2.38",
|
||||
"vue-router": "^4.1.5"
|
||||
},
|
||||
@ -32,7 +33,8 @@
|
||||
"prettier": "^2.7.1",
|
||||
"querystring-es3": "^0.2.1",
|
||||
"sass": "^1.57.1",
|
||||
"vite": "^3.0.9"
|
||||
"vite": "^3.0.9",
|
||||
"vite-require": "^0.2.3"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/parser": {
|
||||
@ -694,6 +696,12 @@
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/es-module-lexer": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.2.1.tgz",
|
||||
"integrity": "sha512-9978wrXM50Y4rTMmW5kXIC09ZdXQZqkE4mxhwkd8VbzsGkXGPgV4zWuqQJgCEzYngdo2dYDa0l8xhX4fkSwJSg==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/esbuild": {
|
||||
"version": "0.15.18",
|
||||
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.15.18.tgz",
|
||||
@ -1298,6 +1306,34 @@
|
||||
"integrity": "sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/fast-glob": {
|
||||
"version": "3.2.12",
|
||||
"resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz",
|
||||
"integrity": "sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@nodelib/fs.stat": "^2.0.2",
|
||||
"@nodelib/fs.walk": "^1.2.3",
|
||||
"glob-parent": "^5.1.2",
|
||||
"merge2": "^1.3.0",
|
||||
"micromatch": "^4.0.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.6.0"
|
||||
}
|
||||
},
|
||||
"node_modules/fast-glob/node_modules/glob-parent": {
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
|
||||
"integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"is-glob": "^4.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 6"
|
||||
}
|
||||
},
|
||||
"node_modules/fast-json-stable-stringify": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
|
||||
@ -1770,6 +1806,28 @@
|
||||
"resolved": "https://registry.npmjs.org/matter-js/-/matter-js-0.19.0.tgz",
|
||||
"integrity": "sha512-v2huwvQGOHTGOkMqtHd2hercCG3f6QAObTisPPHg8TZqq2lz7eIY/5i/5YUV8Ibf3mEioFEmwibcPUF2/fnKKQ=="
|
||||
},
|
||||
"node_modules/merge2": {
|
||||
"version": "1.4.1",
|
||||
"resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
|
||||
"integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">= 8"
|
||||
}
|
||||
},
|
||||
"node_modules/micromatch": {
|
||||
"version": "4.0.5",
|
||||
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz",
|
||||
"integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"braces": "^3.0.2",
|
||||
"picomatch": "^2.3.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.6"
|
||||
}
|
||||
},
|
||||
"node_modules/mime-db": {
|
||||
"version": "1.52.0",
|
||||
"resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
|
||||
@ -2015,6 +2073,14 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/poly-decomp": {
|
||||
"version": "0.3.0",
|
||||
"resolved": "https://registry.npmjs.org/poly-decomp/-/poly-decomp-0.3.0.tgz",
|
||||
"integrity": "sha512-hWeBxGzPYiybmI4548Fca7Up/0k1qS5+79cVHI9+H33dKya5YNb9hxl0ZnDaDgvrZSuYFBhkCK/HOnqN7gefkQ==",
|
||||
"engines": {
|
||||
"node": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/postcss": {
|
||||
"version": "8.4.21",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.21.tgz",
|
||||
@ -2479,6 +2545,27 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/vite-plugin-dynamic-import": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/vite-plugin-dynamic-import/-/vite-plugin-dynamic-import-1.4.0.tgz",
|
||||
"integrity": "sha512-OBWeCGyWE4iIwCUfx3RK8XwT1BjPAJNeMQmdO5md5Gq8PD8gLMCfUnuEiX9dIQDL9Gdvao1GNRqZwfcpwWDTNw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"acorn": "^8.8.2",
|
||||
"es-module-lexer": "^1.2.1",
|
||||
"fast-glob": "^3.2.12"
|
||||
}
|
||||
},
|
||||
"node_modules/vite-require": {
|
||||
"version": "0.2.3",
|
||||
"resolved": "https://registry.npmjs.org/vite-require/-/vite-require-0.2.3.tgz",
|
||||
"integrity": "sha512-Lpeg5mxXiLAVrylKK9FMF8d6yxLBm6YtHXmtWpJSDSWBdl12tBsMGHOBC/fsLzATj+Zp9FHjqwzE1JayOPi9dQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"fast-glob": "^3.2.11",
|
||||
"vite-plugin-dynamic-import": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"node_modules/vue": {
|
||||
"version": "3.2.47",
|
||||
"resolved": "https://registry.npmjs.org/vue/-/vue-3.2.47.tgz",
|
||||
@ -3082,6 +3169,12 @@
|
||||
"esutils": "^2.0.2"
|
||||
}
|
||||
},
|
||||
"es-module-lexer": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.2.1.tgz",
|
||||
"integrity": "sha512-9978wrXM50Y4rTMmW5kXIC09ZdXQZqkE4mxhwkd8VbzsGkXGPgV4zWuqQJgCEzYngdo2dYDa0l8xhX4fkSwJSg==",
|
||||
"dev": true
|
||||
},
|
||||
"esbuild": {
|
||||
"version": "0.15.18",
|
||||
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.15.18.tgz",
|
||||
@ -3427,6 +3520,30 @@
|
||||
"integrity": "sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w==",
|
||||
"dev": true
|
||||
},
|
||||
"fast-glob": {
|
||||
"version": "3.2.12",
|
||||
"resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz",
|
||||
"integrity": "sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@nodelib/fs.stat": "^2.0.2",
|
||||
"@nodelib/fs.walk": "^1.2.3",
|
||||
"glob-parent": "^5.1.2",
|
||||
"merge2": "^1.3.0",
|
||||
"micromatch": "^4.0.4"
|
||||
},
|
||||
"dependencies": {
|
||||
"glob-parent": {
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
|
||||
"integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"is-glob": "^4.0.1"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"fast-json-stable-stringify": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
|
||||
@ -3781,6 +3898,22 @@
|
||||
"resolved": "https://registry.npmjs.org/matter-js/-/matter-js-0.19.0.tgz",
|
||||
"integrity": "sha512-v2huwvQGOHTGOkMqtHd2hercCG3f6QAObTisPPHg8TZqq2lz7eIY/5i/5YUV8Ibf3mEioFEmwibcPUF2/fnKKQ=="
|
||||
},
|
||||
"merge2": {
|
||||
"version": "1.4.1",
|
||||
"resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
|
||||
"integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==",
|
||||
"dev": true
|
||||
},
|
||||
"micromatch": {
|
||||
"version": "4.0.5",
|
||||
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz",
|
||||
"integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"braces": "^3.0.2",
|
||||
"picomatch": "^2.3.1"
|
||||
}
|
||||
},
|
||||
"mime-db": {
|
||||
"version": "1.52.0",
|
||||
"resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
|
||||
@ -3939,6 +4072,11 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"poly-decomp": {
|
||||
"version": "0.3.0",
|
||||
"resolved": "https://registry.npmjs.org/poly-decomp/-/poly-decomp-0.3.0.tgz",
|
||||
"integrity": "sha512-hWeBxGzPYiybmI4548Fca7Up/0k1qS5+79cVHI9+H33dKya5YNb9hxl0ZnDaDgvrZSuYFBhkCK/HOnqN7gefkQ=="
|
||||
},
|
||||
"postcss": {
|
||||
"version": "8.4.21",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.21.tgz",
|
||||
@ -4213,6 +4351,27 @@
|
||||
"rollup": "^2.79.1"
|
||||
}
|
||||
},
|
||||
"vite-plugin-dynamic-import": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/vite-plugin-dynamic-import/-/vite-plugin-dynamic-import-1.4.0.tgz",
|
||||
"integrity": "sha512-OBWeCGyWE4iIwCUfx3RK8XwT1BjPAJNeMQmdO5md5Gq8PD8gLMCfUnuEiX9dIQDL9Gdvao1GNRqZwfcpwWDTNw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"acorn": "^8.8.2",
|
||||
"es-module-lexer": "^1.2.1",
|
||||
"fast-glob": "^3.2.12"
|
||||
}
|
||||
},
|
||||
"vite-require": {
|
||||
"version": "0.2.3",
|
||||
"resolved": "https://registry.npmjs.org/vite-require/-/vite-require-0.2.3.tgz",
|
||||
"integrity": "sha512-Lpeg5mxXiLAVrylKK9FMF8d6yxLBm6YtHXmtWpJSDSWBdl12tBsMGHOBC/fsLzATj+Zp9FHjqwzE1JayOPi9dQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"fast-glob": "^3.2.11",
|
||||
"vite-plugin-dynamic-import": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"vue": {
|
||||
"version": "3.2.47",
|
||||
"resolved": "https://registry.npmjs.org/vue/-/vue-3.2.47.tgz",
|
||||
|
||||
@ -16,6 +16,7 @@
|
||||
"matter-attractors": "^0.1.6",
|
||||
"matter-js": "^0.19.0",
|
||||
"pinia": "^2.0.21",
|
||||
"poly-decomp": "^0.3.0",
|
||||
"vue": "^3.2.38",
|
||||
"vue-router": "^4.1.5"
|
||||
},
|
||||
@ -32,6 +33,7 @@
|
||||
"prettier": "^2.7.1",
|
||||
"querystring-es3": "^0.2.1",
|
||||
"sass": "^1.57.1",
|
||||
"vite": "^3.0.9"
|
||||
"vite": "^3.0.9",
|
||||
"vite-require": "^0.2.3"
|
||||
}
|
||||
}
|
||||
|
||||
@ -132,6 +132,84 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
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);
|
||||
|
||||
this.entites[i].display = {
|
||||
alpha: null,
|
||||
ray: null
|
||||
}
|
||||
// RAYON
|
||||
// https://stackoverflow.com/questions/5731863/mapping-a-numeric-range-onto-another
|
||||
// slope = (output_end - output_start) / (input_end - input_start)
|
||||
// output = output_start + slope * (input - input_start)
|
||||
// from range 0 -> 100 to range 0 -> this.ray
|
||||
let init_max = 100
|
||||
let slope = this.ray / init_max
|
||||
this.entites[i].display.ray = slope * (init_max - entite.prise);
|
||||
// if (this.concernement.id === 28) {
|
||||
// console.log(`entity prise: ${entite.prise} | ray: ${this.entites[i].display.ray}`);
|
||||
// }
|
||||
|
||||
|
||||
// ANGLE
|
||||
// -90 <= mm <= 90
|
||||
if (entite.actuelfuture) {
|
||||
// future en haut : 180 <= a <= 360
|
||||
// from -90 -> 90 to range 180 -> 360
|
||||
this.entites[i].display.alpha = entite.menacemaintien + 270
|
||||
} else {
|
||||
// actuel: en bas : O <= a <= 180
|
||||
// from -90 -> 90 to range 180 -> 0
|
||||
this.entites[i].display.alpha = -1 * entite.menacemaintien + 90
|
||||
}
|
||||
|
||||
// POSITION X Y (par rapport au centre du concernement)
|
||||
this.entites[i].display.pos = {
|
||||
x: this.entites[i].display.ray * Math.cos(this.entites[i].display.alpha * (Math.PI/180)),
|
||||
y: this.entites[i].display.ray * Math.sin(this.entites[i].display.alpha * (Math.PI/180))
|
||||
}
|
||||
|
||||
this.entites_byid[entite.entite.id].display = this.entites[i].display;
|
||||
}
|
||||
},
|
||||
getSalientPoints () {
|
||||
// debugger
|
||||
// console.log(this.entites);
|
||||
let arc = 360/10;
|
||||
// loop through arcs
|
||||
// for (let i = 360/arc; i >= 0 ; i--) {
|
||||
for (let i = 0; i <= 360/arc ; i++) {
|
||||
// loop through entities to find the farest on the arc
|
||||
let max_r = 0;
|
||||
let farest = null;
|
||||
for (let j = 0; j < this.entites.length; j++) {
|
||||
let entite = this.entites[j];
|
||||
if(arc*i <= entite.display.alpha && entite.display.alpha <= arc*i+arc) { // if entity is in arc
|
||||
if (entite.display.ray > max_r) { // && entite.display.ray > this.ray/2 // and farest from minimu
|
||||
// if entity is farest from precedent one
|
||||
max_r = entite.display.ray;
|
||||
// recalcul x & y to get a little padding between entite and contour by increasing ray
|
||||
farest = {
|
||||
alpha: entite.display.alpha,
|
||||
ray: entite.display.ray,
|
||||
pos: {
|
||||
x: (entite.display.ray + 3) * Math.cos(entite.display.alpha * (Math.PI/180)),
|
||||
y: (entite.display.ray + 3) * Math.sin(entite.display.alpha * (Math.PI/180))
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
if (farest) {
|
||||
this.salientPoints.push(farest)
|
||||
}
|
||||
}
|
||||
console.log(`this.salientPoints ${this.concernement.id}`, this.salientPoints);
|
||||
},
|
||||
initCanvasMap (){
|
||||
// console.log(`ConcernementsMapItem ${this.concernement.id} initCanvasMap`);
|
||||
// record canvas and ctx for rendering (drawing)
|
||||
@ -143,6 +221,12 @@ export default {
|
||||
//
|
||||
this.initMatterBody()
|
||||
},
|
||||
getRandomPos(){
|
||||
return {
|
||||
x: this.ray/2 + Math.random()*(this.canvas.width - this.ray),
|
||||
y: this.ray/2 + Math.random()*(this.canvas.height - this.ray)
|
||||
};
|
||||
},
|
||||
initMatterBody (){
|
||||
|
||||
// MATTER
|
||||
@ -752,11 +836,12 @@ export default {
|
||||
this.ctx.lineWidth = 1;
|
||||
this.ctx.strokeStyle = strokeStyle;
|
||||
this.ctx.fillStyle = fillStyle;
|
||||
this.ctx.moveTo(this.pos.x+this.salientPoints[0].pos.x*this.scale*1.15, this.pos.y+this.salientPoints[0].pos.y*this.scale*1.15)
|
||||
let gap = 1;//1.15;
|
||||
this.ctx.moveTo(this.pos.x+this.salientPoints[0].pos.x*this.scale*gap, this.pos.y+this.salientPoints[0].pos.y*this.scale*gap)
|
||||
for (let j = 1; j < this.salientPoints.length; j++) {
|
||||
this.ctx.lineTo(this.pos.x+this.salientPoints[j].pos.x*this.scale*1.15, this.pos.y+this.salientPoints[j].pos.y*this.scale*1.15)
|
||||
this.ctx.lineTo(this.pos.x+this.salientPoints[j].pos.x*this.scale*gap, this.pos.y+this.salientPoints[j].pos.y*this.scale*gap)
|
||||
}
|
||||
this.ctx.lineTo(this.pos.x+this.salientPoints[0].pos.x*this.scale*1.15, this.pos.y+this.salientPoints[0].pos.y*this.scale*1.15)
|
||||
this.ctx.lineTo(this.pos.x+this.salientPoints[0].pos.x*this.scale*gap, this.pos.y+this.salientPoints[0].pos.y*this.scale*gap)
|
||||
this.ctx.fill();
|
||||
this.ctx.stroke();
|
||||
}
|
||||
|
||||
@ -115,10 +115,14 @@ export default {
|
||||
animate () {
|
||||
this.canvasMap.ctx.clearRect(0, 0, this.canvasMap.canvas.width, this.canvasMap.canvas.height)
|
||||
// this.canvasMap.canvas.dispatchEvent(this.animateEvent)
|
||||
Matter.Engine.update(this.engine, 1)
|
||||
Matter.Engine.update(this.engine, 1);
|
||||
// this.checkMouseHover();
|
||||
window.requestAnimationFrame(this.animate);
|
||||
},
|
||||
onMouseMove (e) {
|
||||
this.checkMouseHover();
|
||||
},
|
||||
checkMouseHover(){
|
||||
// check item mouse over
|
||||
let query;
|
||||
if (this.opened) {
|
||||
|
||||
@ -3,10 +3,11 @@ import { fileURLToPath, URL } from 'node:url'
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import graphql from '@rollup/plugin-graphql';
|
||||
import { viteRequire } from 'vite-require'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [vue(), graphql()],
|
||||
plugins: [vue(), graphql(), viteRequire()],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user