Hw4 helper
by zx22516969
HTML
<div id="info">Homework 4 Helper<br>Right click add a point
<br><button id="compute" style="width:20%">make AABB</button>
<button id="reset" style="width:20%">reset</button>
</div>
<script src="http://cdnjs.cloudflare.com/ajax/libs/three.js/84/three.min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<!-- the following disable the regular right-button click -->
<script type="text/javascript">
document.oncontextmenu = function() {
return false;
}
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/numeric/1.2.6/numeric.min.js"></script>
CSS
#info {
position: absolute;
top: 0px;
width: 100%;
padding: 10px;
text-align: center;
color: #ffff00
}
body {
overflow: hidden;
}
JavaScript
var camera, scene, renderer;
var mouse = new THREE.Vector2();
var point;
var points = [];
var halfSize = 50;
init();
animate();
$('#reset').click (function() {
scene.remove (scene.getObjectByName ('aabb'));
points.forEach (function(point) {
scene.remove(point)
})
points=[];
})
$("#compute").click(function() {
scene.remove (scene.getObjectByName ('aabb'));
/* let minX = 1e3,
maxX = -1e3;
let minY = 1e3,
maxY = -1e3;
for (let i = 0; i < points.length; i++) {
if (points[i].position.x < minX)
minX = points[i].position.x;
if (points[i].position.x > maxX)
maxX = points[i].position.x;
if (points[i].position.y < minY)
minY = points[i].position.y;
if (points[i].position.y > maxY)
maxY = points[i].position.y;
}*/
var l=points.length;
var unitx=[],unity=[];
var sumx=0,sumy=0;
var avgx=0,avgy=0;
var covxx=0,covxy=0,covyx=0,covyy=0;
for(let i=0;i<l;i++){
sumx+=points[i].position.x;
sumy+=points[i].position.y;
}
console.log(sumx+sumy);
avgx=sumx/l;
avgy=sumy/l;
for(let j=0;j<l;j++){
unitx[j]=points[j].position.x-avgx;
unity[j]=points[j].position.y-avgy;
}
for(let k=0;k<l;k++){
covxx=(covxx+Math.pow(unitx[k],2)/(l-1));
covxy=covxy+(unitx[k]*unity[k])/(l-1);
covyx=covxy;
covyy=(covyy+Math.pow(unity[k],2)/(l-1));
}
var A=[[covxx,covxy],
[covyx,covyy]
];
var ev=numeric.eig(A);
// var t=0;
var At=[[ev.E.x[0][0],ev.E.x[0][1]],
[ev.E.x[1][0],ev.E.x[1][1]]
];
var t=numeric.inv(At);
var aabbX=[],aabbY=[];
for(let i=0;i<l;i++){
aabbX[i]=t[0][0]*unitx[i]+t[0][1]*unity[i];
aabbY[i]=t[1][0]*unitx[i]+t[1][1]*unity[i];
}
var maxX,maxY,minX,minY;
maxX=Math.max.apply(null,aabbX);
maxY=Math.max.apply(null,aabbY);
minX=Math.min.apply(null,aabbX);
minY=Math.min.apply(null,aabbY);
var orinx1,orinx2,orinx3,orinx4,oriny1,oriny2,oriny3,oriny4;
orinx1=ev.E.x[0][0]*minX+ev.E.x[0][1]*minY+avgx;
...