<!DOCTYPE html>
<html lang="en">
<head>
<title>CMODS</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<!-- <link type="text/css" rel="stylesheet" href="main.css"> -->
<style>
body {
background-color: #020227;
color: #444;
}
a {
color: #08f;
}
.label {
color: #FFF;
font-family: sans-serif;
padding: 2px;
background: rgba( 0, 0, 0, .6 );
}
</style>
</head>
<body>
<div id="3d-graph"></div>
<script src="//unpkg.com/three"></script>
<script src="../lib/TransformControls.js"></script>
<script src="../lib/STLLoader.js"></script>
<script src="../lib/js-colormaps.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- <script src="//unpkg.com/3d-force-graph"></script> -->
<script src="../lib/3d-force-graph.js"></script>
<script src="//unpkg.com/three-spritetext"></script>
<script src="../lib/dat.gui.js"></script>
<script src="../visualization/utils.js"></script>
<script src="../visualization/geometry.js"></script>
<script src="../visualization/boundaryUtils.js"></script>
<!-- <script src="../visualization/boundary.js"></script> -->
<script>
var color1= 0xffffff; /*white*/
var color2= '#020227'; /*kohly*/
var color3= 0x1c5c61; /*teal*/
var color4= "#fa6e70"; //red/orange
var color5="#380152"; //purple
var color6="#696767"; //grey
var color7="#03dbfc"; //blue
var setup,Graph,gData,scene,camera,renderer,orbit,gui,guiSupport,guiLoad;
var scale=10.0;
var setupEmpty={//empty
nodes: [
],
edges: [
],
//material properties - AISI 1095 Carbon Steel (Spring Steel)
ndofs : 3*6,
animation : {
showDisplacement : true,
exaggeration : 20e2,
speed:3.0
},
viz : {
minStress:10e6,
maxStress: -10e6,
colorMaps:[coolwarm,YlGnBu, winter ,jet],
colorMap:0,
},
};
setup=setupEmpty;
var supportCount=0;
var supportBoxes=[];
var supportControls=[];
var guiSupports=[];
var loadCount=0;
var loadBoxes=[];
var loadControls=[];
var guiLoads=[];
var guiCMODS,gui_STL_particles,gui_particles_bonds,gui_bonds_stress_strain,gui_strain_GL
var name="test";
//////////////init///////////////////////
// $.getJSON("../json/"+fileName+".json", function(json) {
[scene,camera,renderer,orbit]=loadGraph(setup,scale);
setup.supports=[];
setup.loads=[];
setup.viz=[];
gui = new dat.GUI();
var scaleFit=1;
var loader = new THREE.STLLoader();
var group;
var translationVector;
setup.cmods={
stlFileName:"test",
STL_particles:{
nlattice:"100",
stlName:'test',
},
particles_bonds:{
grid:"1024",
block:"1024",
},
bonds_stress_strain:{
grid:"512",
block: "512",
spring: "30000000",
mass: "1",
dissipation: "100",
dt: "0.0001",
nloop: "1000",
load:{
type:"zlimit",
percent:"5",
// type:"ycylinder",
// cx:{
// min: "37.5",
// max: "37.5",
// },
// cz:{
// min: "23.0",
// max: "40.7",
// },
// cr:{
// min: "4.0",
// max: "4.0",
// },
lmin:{
x: "0",
y: "0",
z: "0",
},
lmax:{
x: "0",
y: "0",
z: "0",
},
smin:{
x: "0",
y: "0",
z: "0",
},
smax:{
x: "0",
y: "0",
z: "0",
},
},
step: "-0.0002",
bond:"15"
},
strain_GL:{
size:"1.5",
scale:"200",
rx:"1.55",
ry:"0.0",
rz:"0.0",
sxyz:"0.25",
perspective:"0.05"
}
}
setup.run=false;
initialGui();
function initialGui(){
gui.add(setup.cmods,'stlFileName').listen();
gui.add(calls, "Load STL");
guiCMODS=gui.addFolder('CMODS Setup');
gui_STL_particles=guiCMODS.addFolder('STL_particles');
gui_STL_particles.add(setup.cmods.STL_particles,'nlattice').listen();
gui_STL_particles.add(setup.cmods.STL_particles,'stlName').listen();
gui_particles_bonds=guiCMODS.addFolder('particles_bonds');
gui_particles_bonds.add(setup.cmods.particles_bonds,'grid').listen();
gui_particles_bonds.add(setup.cmods.particles_bonds,'block').listen();
gui_bonds_stress_strain=guiCMODS.addFolder('bonds_stress_strain');
gui_bonds_stress_strain.add(setup.cmods.bonds_stress_strain,'grid').listen();
gui_bonds_stress_strain.add(setup.cmods.bonds_stress_strain,'block').listen();
gui_bonds_stress_strain.add(setup.cmods.bonds_stress_strain,'spring').listen();
gui_bonds_stress_strain.add(setup.cmods.bonds_stress_strain,'mass').listen();
gui_bonds_stress_strain.add(setup.cmods.bonds_stress_strain,'dissipation').listen();
gui_bonds_stress_strain.add(setup.cmods.bonds_stress_strain,'dt').listen();
gui_bonds_stress_strain.add(setup.cmods.bonds_stress_strain,'nloop').listen();
gui_bonds_stress_strain.add(setup.cmods.bonds_stress_strain.load,'type').listen();
gui_bonds_stress_strain.add(setup.cmods.bonds_stress_strain.load,'percent').listen();
gui_bonds_stress_strain.add(setup.cmods.bonds_stress_strain,'step').listen();
gui_bonds_stress_strain.add(setup.cmods.bonds_stress_strain,'bond').listen();
gui_strain_GL=guiCMODS.addFolder('strain_GL');
gui_strain_GL.add(setup.cmods.strain_GL,'size').listen();
gui_strain_GL.add(setup.cmods.strain_GL,'scale').listen();
gui_strain_GL.add(setup.cmods.strain_GL,'rx').listen();
gui_strain_GL.add(setup.cmods.strain_GL,'ry').listen();
gui_strain_GL.add(setup.cmods.strain_GL,'rz').listen();
gui_strain_GL.add(setup.cmods.strain_GL,'sxyz').listen();
gui_strain_GL.add(setup.cmods.strain_GL,'perspective').listen();
}
function loadSTL(name){
loader.load( "../CAD/"+name+".stl", function ( geometry ) {
var material = new THREE.MeshPhongMaterial(
{
vertexColors: THREE.VertexColors
});
// material.vertexColors = THREE.VertexColors;
var count=geometry.attributes.position.count*3;
var colors=[]
for(var i=0;i<count/3.0;i++){
colors.push(28.0/255.0);
colors.push(92.0/255.0);
colors.push(97.0/255.0); //teal
}
var colors = new Float32Array( colors );
geometry.setAttribute('color', new THREE.BufferAttribute(colors, 3));
group = new THREE.Mesh( geometry, material );
// console.log(geometry.attributes.position.array);
// group.geometry.colorsNeedUpdate = true;
group.geometry.attributes.color.needsUpdate = true;
// group.position.set( 0, -5.0*scale, 0.0 );
// group.rotation.set( - Math.PI / 2, 0, 0 );
// group.scale.set( scale, scale, scale );
group.name=name;
var box1 = new THREE.Box3();
group.updateMatrix();group.updateMatrix();
group.geometry.computeBoundingBox();
box1.copy( group.geometry.boundingBox ).applyMatrix4( group.matrixWorld );
scaleFit=1.0/box1.max.z;
console.log(box1)
translationVector=box1.getCenter().clone();
group.position.set( -translationVector.x, -translationVector.y, -translationVector.z );
var box = new THREE.Box3();
// group.updateMatrix();
group.geometry.computeBoundingBox();
box.copy( group.geometry.boundingBox ).applyMatrix4( group.matrixWorld );
var helper = scene.getObjectByName( "gridHelper" );
helper.position.y=box.getCenter().y-box.max.y;
// console.log(box.center())
// console.log(box.max)
// helper.position.y=box.center().y/2;
scene.add( group.clone() );
} );
}
function updateNodeColors(){
var count=group.geometry.attributes.position.count*3;
var colors=[]
for(var i=0;i<count/3.0;i++){
colors.push(28.0/255.0);
colors.push(92.0/255.0);
colors.push(97.0/255.0); //teal
//check if load
for(var j=0;j<loadCount;j++){
var box1 = new THREE.Box3();
loadBoxes[j].geometry.computeBoundingBox();
box1.copy( loadBoxes[j].geometry.boundingBox ).applyMatrix4( loadBoxes[j].matrixWorld );
setup.loads[j][0].min.x=box1.min.x;
setup.loads[j][0].min.y=box1.min.y;
setup.loads[j][0].min.z=box1.min.z;
setup.loads[j][0].max.x=box1.max.x;
setup.loads[j][0].max.y=box1.max.y;
setup.loads[j][0].max.z=box1.max.z;
var point=new THREE.Vector3(
group.geometry.attributes.position.array[i*3]-translationVector.x,
group.geometry.attributes.position.array[i*3+1]-translationVector.y,
group.geometry.attributes.position.array[i*3+2]-translationVector.z);
var inside=false;
if(setup.loads[j][2].type=="cylinder"){
if(box1.containsPoint(point)){
inside=pointInMesh(point,loadBoxes[j]);
}
}else{
inside=box1.containsPoint(point);
}
if(inside){
colors[i*3]=(3.0/255.0);
colors[i*3+1]=(219.0/255.0);
colors[i*3+2]=(252.0/255.0); //blue
}
}
//check if support
for(var j=0;j<supportCount;j++){
var box = new THREE.Box3();
supportBoxes[j].geometry.computeBoundingBox();
box.copy( supportBoxes[j].geometry.boundingBox ).applyMatrix4( supportBoxes[j].matrixWorld );
setup.supports[j][0].min.x=box.min.x;
setup.supports[j][0].min.y=box.min.y;
setup.supports[j][0].min.z=box.min.z;
setup.supports[j][0].max.x=box.max.x;
setup.supports[j][0].max.y=box.max.y;
setup.supports[j][0].max.z=box.max.z;
var point=new THREE.Vector3(
group.geometry.attributes.position.array[i*3]-translationVector.x,
group.geometry.attributes.position.array[i*3+1]-translationVector.y,
group.geometry.attributes.position.array[i*3+2]-translationVector.z);
var inside=false;
if(setup.supports[j][2].type=="cylinder"){
if(box.containsPoint(point)){
inside=pointInMesh(point,supportBoxes[j])
}
}else{
inside=box.containsPoint(point);
}
if(inside){
colors[i*3]=(255.0/255.0);
colors[i*3+1]=(92.0/255.0);
colors[i*3+2]=(97.0/255.0); //orange
}
}
}
var colors = new Float32Array( colors );
group.geometry.setAttribute('color', new THREE.BufferAttribute(colors, 3));
// console.log(group.geometry.attributes.position.array);
// group.geometry.colorsNeedUpdate = true;
group.geometry.attributes.color.needsUpdate = true;
}
function pointInMesh(point,mesh){
const direction = new THREE.Vector3(1, 1, 1);
const geometry = new THREE.BoxGeometry(5, 5, 5)
// const material = new THREE.MeshBasicMaterial({ color: 0xffff00, side: THREE.DoubleSide });
// const mesh = new THREE.Mesh(geometry, material)
const raycaster = new THREE.Raycaster()
raycaster.set(point, direction);
const intersects = raycaster.intersectObject(mesh);
// if (intersects.length && direction.dot(intersects[0].face.normal) > 0) {
// return true;
// // console.log(`Point is in object`);
// } else {
// return false;
// // console.log(`Point is out of object`);
// }
if( intersects.length %2 === 1) { // Points is in objet
// console.log(`Point is in object`)
return true;
}else{
return false;
}
}
function exportBoundaryConditions(){
//check if load
for(var j=0;j<loadCount;j++){
var box1 = new THREE.Box3();
loadBoxes[j].geometry.computeBoundingBox();
box1.copy( loadBoxes[j].geometry.boundingBox ).applyMatrix4( loadBoxes[j].matrixWorld );
setup.loads[j][0].min.x=box1.min.x;
setup.loads[j][0].min.y=box1.min.y;
setup.loads[j][0].min.z=box1.min.z;
setup.loads[j][0].max.x=box1.max.x;
setup.loads[j][0].max.y=box1.max.y;
setup.loads[j][0].max.z=box1.max.z;
}
//check if support
for(var j=0;j<supportCount;j++){
var box = new THREE.Box3();
supportBoxes[j].geometry.computeBoundingBox();
box.copy( supportBoxes[j].geometry.boundingBox ).applyMatrix4( supportBoxes[j].matrixWorld );
setup.supports[j][0].min.x=box.min.x;
setup.supports[j][0].min.y=box.min.y;
setup.supports[j][0].min.z=box.min.z;
setup.supports[j][0].max.x=box.max.x;
setup.supports[j][0].max.y=box.max.y;
setup.supports[j][0].max.z=box.max.z;
}
if(supportCount>0&&loadCount>0){
setup.cmods.bonds_stress_strain.load.type="loadbox";
setup.cmods.bonds_stress_strain.load.lmin.x=(setup.loads[0][0].min.x+translationVector.x);
setup.cmods.bonds_stress_strain.load.lmin.y=(setup.loads[0][0].min.z+translationVector.z);
setup.cmods.bonds_stress_strain.load.lmin.z=-(setup.loads[0][0].max.y+translationVector.y);
setup.cmods.bonds_stress_strain.load.lmax.x=(setup.loads[0][0].max.x+translationVector.x);
setup.cmods.bonds_stress_strain.load.lmax.y=(setup.loads[0][0].max.z+translationVector.z);
setup.cmods.bonds_stress_strain.load.lmax.z=-(setup.loads[0][0].min.y+translationVector.y);
setup.cmods.bonds_stress_strain.load.smin.x=(setup.supports[0][0].min.x+translationVector.x);
setup.cmods.bonds_stress_strain.load.smin.y=(setup.supports[0][0].min.z+translationVector.z);
setup.cmods.bonds_stress_strain.load.smin.z=-(setup.supports[0][0].max.y+translationVector.y);
setup.cmods.bonds_stress_strain.load.smax.x=(setup.supports[0][0].max.x+translationVector.x);
setup.cmods.bonds_stress_strain.load.smax.y=(setup.supports[0][0].max.z+translationVector.z);
setup.cmods.bonds_stress_strain.load.smax.z=-(setup.supports[0][0].min.y+translationVector.y);
}
console.log(setup.cmods.bonds_stress_strain.load.lmin)
console.log(setup.cmods.bonds_stress_strain.load.lmax)
console.log(setup.cmods.bonds_stress_strain.load.smin)
console.log(setup.cmods.bonds_stress_strain.load.smax)
setup.run=true;
console.log("run (client)");
$.post("/", { data : { foo : JSON.stringify(setup) } }, function(temp) {
// temp === "I am done";
});
}
$.post("/", { data : { foo : JSON.stringify(setup) } }, function(temp) {
// temp === "I am done";
});
</script>
</body>
</html>