Задача Д.24, вариант 20 из Задачника Яблонского — различия между версиями

Материал из Department of Theoretical and Applied Mechanics
Перейти к: навигация, поиск
 
Строка 16: Строка 16:
 
'''Текст программы:''' <div class="mw-collapsible-content">
 
'''Текст программы:''' <div class="mw-collapsible-content">
 
<syntaxhighlight lang="javascript" line start="1" enclose="div">
 
<syntaxhighlight lang="javascript" line start="1" enclose="div">
<!DOCTYPE html>
+
     const scene = new THREE.Scene();
<html>
+
     const camera = new THREE.PerspectiveCamera(60, 1, 1, 100);
<head>
+
     const renderer = new THREE.WebGLRenderer();
     <title> D24_20</title>
 
    <script type="text/javascript" src="three.js"></script>
 
     <script type="text/javascript" src="stats.min.js"></script>
 
     <script type="text/javascript" src="dat.gui.js"></script>
 
<script type="text/javascript" src="CurveExtras1.js"></script>
 
<script type="text/javascript" src="OrbitControls.js"></script>
 
    <style>
 
        body {
 
            /* set margin to 0 and overflow to hidden, to go fullscreen */
 
            margin: 0;
 
            /* overflow: hidden; */
 
        }
 
    </style>
 
</head>
 
<body>
 
<canvas id="canvas_example" width = 100 height = 200></canvas>
 
<canvas id="canvas_example2" width = 1000 height = 200></canvas><br>
 
<div id="Stats-output">
 
</div>
 
<!-- Div which will hold the Output -->
 
<div id="WebGL-output">
 
</div>
 
  
<script type="text/javascript">
+
    //Постановка задачи(условия)
 +
    const R = 2;
 +
    const solution = new function () {
 +
        this.c1 = 20000;
 +
        this.c2 = 30000;
 +
        this.c3 = 10000;
 +
        this.R = .2;
 +
        this.t = 0;
 +
        this.dt = .7;
  
    function init() {
+
        this.m1 = 50;
 +
        this.m2 = 60;
 +
        this.m3 = 40;
 +
        this.m4 = 50;
  
        var stats = initStats();
 
  
         var scene = new THREE.Scene();
+
         this.a11 = .5*(this.m1+this.m2)*Math.pow(this.R,2);
 +
        this.a22 = .5*(this.m3+this.m4)*Math.pow(this.R,2);
 +
        this.c11 = this.c1+this.c2/1.44;
 +
        this.c22 = this.c2/.81 + this.c3;
 +
        this.c12 = this.c2/(1.2*.9);
 +
        this.D = Math.sqrt(Math.pow(this.a11 * this.c22 + this.a22 * this.c11,2) -4 * this.a11 * this.a22 * (this.c11 * this.c22 - Math.pow(this.c12,2)));
 +
        this.k1 = '' + Math.sqrt((this.a11 * this.c22 + this.a22 * this.c11 + this.D)/(2*this.a11*this.a22));
 +
        this.k2 = '' + Math.sqrt((this.a11 * this.c22 + this.a22 * this.c11 - this.D)/(2*this.a11*this.a22));
  
         var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 1000);
+
         this.p1 = -(this.c11 - this.a11*Math.pow(this.k1,2))/this.c12;
 +
        this.p2 = -(this.c11 - this.a11*Math.pow(this.k2,2))/this.c12;
  
         var renderer = new THREE.WebGLRenderer();
+
         let self = this;
  
         renderer.setClearColor(new THREE.Color(0xEEEEEE));
+
         this.redraw = function() {
        renderer.setSize(window.innerWidth, window.innerHeight);
+
            self.t = 0;
+
            ctx.clearRect(0,-242,500,500);
var orbitControls = new THREE.OrbitControls(camera);
+
            ctx1.clearRect(0,-242,500,500);
         orbitControls.autoRotate = true;
+
         };
          
+
    };
var planeGeometry = new THREE.PlaneGeometry(10,20,1,1);
+
    class Construction {
        var planeMaterial = new THREE.MeshLambertMaterial({color: 0xffffff});
+
         constructor(geometry,material,x,y,z) {
        var plane1 = new THREE.Mesh(planeGeometry,planeMaterial);
+
            this.geometry = geometry;
var plane2 = new THREE.Mesh(planeGeometry,planeMaterial);
+
            this.material = material;
+
            this.x = x;
plane1.rotation.y = -0.5*Math.PI;
+
            this.y = y;
        plane1.position.x = -10;
+
            this.z = z;
scene.add(plane1);
+
            this.mesh = new THREE.Mesh(geometry,material);
plane1.receiveShadow = true;
+
        }
+
        build(scene,angleX,angleY,angleZ) {
        plane2.rotation.y = -0.5*Math.PI;
+
            this.mesh.position.x = this.x;
plane2.position.x = 10;
+
            this.mesh.position.y = this.y;
scene.add(plane2);
+
            this.mesh.position.z = this.z;
plane2.receiveShadow = true;
+
            this.mesh.rotation.x = angleX;
+
            this.mesh.rotation.y = angleY;
var cubeGeometry1 = new THREE.CubeGeometry(18,7,5);
+
            this.mesh.rotation.z = angleZ;
         var cubeMaterial1 = new THREE.MeshLambertMaterial({color: 0xffff00});
+
            scene.add(this.mesh);
        var cube1 = new THREE.Mesh(cubeGeometry1, cubeMaterial1);
+
         }
        cube1.castShadow = true;
+
    }
  
var cubeGeometry2 = new THREE.CubeGeometry(17.5,1,2);
+
    class Moving_parts extends Construction {
        var cubeMaterial2 = new THREE.MeshLambertMaterial({color: 0x00ffff});
+
        spin(solution,sign,ratio,r) {
var cube2 = new THREE.Mesh(cubeGeometry2, cubeMaterial2);
+
            let r1 = 1;
        cube2.castShadow = true;
+
            let r2 = 1;
cube2.position.x = 3.75;
+
            if(r !== 1) {
cube2.position.y = 20;
+
                r1 =  solution.p1;
cube2.geometry.translate(-3.75,0,0);
+
                r2 =  solution.p2;
         scene.add(cube2);
+
            }
 +
            this.mesh.rotation.x = r1 * sign * Math.sin(solution.k1 * solution.t / 1000) * 2 / ratio + r2 * sign * Math.sin(solution.k2 * solution.t / 1000) * 2 / ratio;
 +
        }
 +
        static equation(solution,sign,ratio,r,t) {
 +
            let r1 = 1;
 +
            let r2 = 1;
 +
            if(r !== 1) {
 +
                r1 = solution.p1;
 +
                r2 =  solution.p2;
 +
            }
 +
            return r1 * sign * Math.sin(solution.k1 * t / 1000) * 50 / ratio + r2 * sign * Math.sin(solution.k2 * t / 1000) * 50 / ratio;
 +
         }
 +
    }
  
        var cylinderGeometry = new THREE.CylinderGeometry(0.5, 0.5, 3, 30, 30);
 
        var cylinderMaterial = new THREE.MeshLambertMaterial({color: 0xffff00});
 
var cylinder1 = new THREE.Mesh(cylinderGeometry, cylinderMaterial);
 
cylinder1.rotation.x = -0.5*Math.PI;
 
cylinder1.position.x = -9.5;
 
cylinder1.position.y = -2.5;
 
cylinder1.castShadow = true;
 
 
var cylinder2 = new THREE.Mesh(cylinderGeometry, cylinderMaterial);
 
cylinder2.rotation.x = -0.5*Math.PI;
 
cylinder2.position.x = -9.5;
 
cylinder2.position.y = 2.5;
 
cylinder2.castShadow = true;
 
 
var cylinder3 = new THREE.Mesh(cylinderGeometry, cylinderMaterial);
 
cylinder3.rotation.x = -0.5*Math.PI;
 
cylinder3.position.x = 9.5;
 
cylinder3.position.y = -2.5;
 
cylinder3.castShadow = true;
 
 
var cylinder4 = new THREE.Mesh(cylinderGeometry, cylinderMaterial);
 
cylinder4.rotation.x = -0.5*Math.PI;
 
cylinder4.position.x = 9.5;
 
cylinder4.position.y = 2.5;
 
cylinder4.castShadow = true;
 
  
        var cylinderGeometry1 = new THREE.CylinderGeometry(0.5, 1.5, 2, 4, 4);
+
    renderer.setClearColor(0xEEEEEE);
var cylinder5 = new THREE.Mesh(cylinderGeometry1, cylinderMaterial);
+
    renderer.setSize(600, 600);
cylinder5.rotation.y = -1.25*Math.PI;
+
    let main = document.getElementById("canvas_3d");
cylinder5.position.x = 3.75;
+
    main.appendChild(renderer.domElement);
cylinder5.position.y = 18.5;
+
    renderer.domElement.style.border = "1px solid#000";
cylinder5.castShadow = true;
 
scene.add(cylinder5);
 
       
 
var material = new THREE.MeshLambertMaterial( { color: 0xff00ff } );
 
var wireframeMaterial = new THREE.MeshBasicMaterial( { color: 0xf00000, opacity: 0.3, wireframe: true, transparent: true } );
 
        var HelixCurve = new THREE.Curves.HelixCurve(10);
 
        var springMaterial = new THREE.MeshBasicMaterial( { color: 0xff00ff } );
 
        var tubeGeometry = new THREE.TubeBufferGeometry(HelixCurve, 100, 0.5, 3, false);
 
        var spring1 = THREE.SceneUtils.createMultiMaterialObject( tubeGeometry, [ material, wireframeMaterial] );
 
        var spring2 = THREE.SceneUtils.createMultiMaterialObject( tubeGeometry, [ material, wireframeMaterial] );
 
  
spring1.scale.x = 0.02;
 
spring1.scale.y = 0.02;
 
spring1.scale.z = 0.1;
 
        spring1.rotation.x = -0.5 * Math.PI;
 
        spring1.position.x = 8;
 
        spring1.castShadow = true;
 
 
spring2.scale.x = 0.02;
 
spring2.scale.y = 0.02;
 
spring2.scale.z = 0.1;
 
        spring2.rotation.x = -0.5 * Math.PI;
 
        spring2.position.x = -7.5;
 
        spring2.castShadow = true;
 
 
var group1 = new THREE.Object3D();
 
group1.add(cube1);
 
group1.add(cylinder1);
 
group1.add(cylinder2);
 
group1.add(cylinder3);
 
group1.add(cylinder4);
 
group1.add(spring1);
 
group1.add(spring2);
 
scene.add(group1);
 
 
camera.position.x = -20;
 
camera.position.y = 10;
 
        camera.position.z = 80;
 
        camera.lookAt(new THREE.Vector3(10, 5, 1));
 
  
        var ambientLight = new THREE.AmbientLight(0x0c0c0c);
+
    let gr = new GraphicBulider(450,242);
        scene.add(ambientLight);
+
    let ctx = gr.dom("canvas_1");
 +
    let gr1 = new GraphicBulider(450,242);
 +
    let ctx1 = gr1.dom("canvas_2");
 +
    let buffer = GraphicBulider.createBuffer();
 +
    let buffer1 = GraphicBulider.createBuffer();
  
        var spotLight = new THREE.SpotLight(0xffffff);
 
        spotLight.position.set(-20,10,80);
 
        scene.add(spotLight);
 
  
        document.getElementById("WebGL-output").appendChild(renderer.domElement);
+
    const spotLight = new THREE.SpotLight( 0xffffff );
       
+
    spotLight.position.set( 50, 80, 20 );
var step = 0;
+
    scene.add(spotLight);
        var scalingStep = 0;
 
         
 
        var controls = new function () {
 
        this.t = 1;
 
       
 
        this.c1 = 40*100;
 
        this.c2 = 60*100;
 
        this.l = 0.5;
 
  
            this.m1 = 8;
+
    const axes = new THREE.AxisHelper( 20 );
            this.m2 = 10;
+
    scene.add(axes);
           
 
           
 
            this.a11 = this.m2;
 
            this.a22 = 19/12 * this.m1 * this.l * this.l;
 
            this.c11 = this.c1 + this.c2;
 
            this.c22 = 6.25 * this.c1 * this.l * this.l + this.c2* this.l * this.l;
 
            this.c12 = (2 * this.c2 * this.l - 5 * this.c1 * this.l)/2;
 
this.D = Math.sqrt((this.a11 * this.c22 + this.a22 * this.c11)*(this.a11 * this.c22 + this.a22 * this.c11) -4*this.a11 * this.a22*(this.c11 * this.c22 - this.c12 * this.c12));
 
            this.k1 = '' + Math.sqrt((this.a11 * this.c22 + this.a22 * this.c11 + this.D)/(2*this.a11*this.a22));
 
            this.k2 = '' + Math.sqrt((this.a11 * this.c22 + this.a22 * this.c11 - this.D)/(2*this.a11*this.a22));
 
                       
 
                       
 
            this.redraw = function() {
 
step = 0;   
 
};
 
        };
 
           
 
       
 
        var gui = new dat.GUI();
 
 
 
        gui.add(controls, 'm1',5,20).onChange(controls.redraw)  ;
 
        gui.add(controls, 'm2',5,20).onChange(controls.redraw) ;
 
        gui.add(controls, 'c1',0*100,100*100).onChange(controls.redraw) ;
 
        gui.add(controls, 'c2',0*100,100*100).onChange(controls.redraw) ;  
 
  
        gui.add(controls, 'k1').listen() ;  
+
    //Условия задачи
        gui.add(controls, 'k2').listen() ;
+
    let wall_1 = new Construction(new THREE.CubeGeometry(10,5,1),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),0,0,0);
gui.add(controls, 'redraw');
+
    let shaft_1 = new Construction(new THREE.CylinderGeometry(.5,.5,10,20,10),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),5.5,0,0);
controls.redraw();
+
    let wheel_1 = new Moving_parts(new THREE.CylinderGeometry(2*R,2*R,1,20,5),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: true}),11,0,0);
       
+
    let wheel_2 = new Moving_parts(new THREE.CylinderGeometry(2*R*1.2,2*R*1.2,1,20,5),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: true}),11,-(2*R+1.2*R*2),0);
        render();
+
    let shaft_2 = new Construction(new THREE.CylinderGeometry(.5,.5,10,20,10),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),16.5,-(2*R+1.2*R*2),0);
       
+
    let wheel_3 = new Moving_parts(new THREE.CylinderGeometry(2*R*.9,2*R*.9,1,20,5),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: true}),22,-(2*R+1.2*R*2),0);
function render() {
+
    let wheel_4 = new Moving_parts(new THREE.CylinderGeometry(2*R,2*R,1,20,5),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: true}),22,-(2*R+1.2*R*2+.9*R*2+2*R),0);
            stats.update();
+
    let shaft_3 = new Construction(new THREE.CylinderGeometry(.5,.5,5,20,10),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),19,-(2*R+1.2*R*2+.9*R*2+2*R),0);
           
+
    let wall_2 = new Construction(new THREE.CubeGeometry(10,5,1),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),17,-(2*R+1.2*R*2+.9*R*2+2*R),0);
controls.a11 = controls.m2;
+
    wall_1.build(scene,0,Math.PI/2,0);
            controls.a22 = 19/12 * controls.m1 * controls.l * controls.l;
+
    shaft_1.build(scene,0,0,Math.PI/2);
            controls.c11 = controls.c1 + controls.c2;
+
    wheel_1.build(scene,0,0,Math.PI/2);
            controls.c22 = 6.25 * controls.c1 * controls.l * controls.l + controls.c2* controls.l * controls.l;
+
    wheel_2.build(scene,0,0,Math.PI/2);
            controls.c12 = (2 * controls.c2 * controls.l - 5 * controls.c1 * controls.l)/2;
+
    shaft_2.build(scene,0,0,Math.PI/2);
controls.D = Math.sqrt((controls.a11 * controls.c22 + controls.a22 * controls.c11)*(controls.a11 * controls.c22 + controls.a22 * controls.c11)
+
    wheel_3.build(scene,0,0,Math.PI/2);
-4*controls.a11 * controls.a22*(controls.c11 * controls.c22 - controls.c12 * controls.c12));
+
    wheel_4.build(scene,0,0,Math.PI/2);
            controls.k1 = '' + Math.sqrt((controls.a11 * controls.c22 + controls.a22 * controls.c11 + controls.D)/(2*controls.a11*controls.a22));
+
    shaft_3.build(scene,0,0,Math.PI/2);
            controls.k2 = '' + Math.sqrt((controls.a11 * controls.c22 + controls.a22 * controls.c11 - controls.D)/(2*controls.a11*controls.a22));
+
    wall_2.build(scene,0,Math.PI/2,0);
 
  
var cty = canvas_example2.getContext("2d");
+
    camera.position.x = 20;
var w = canvas_example2.width;
+
    camera.position.y = 10;
var h = canvas_example2.height;
+
    camera.position.z = 40;
+
    camera.lookAt(scene.position);
cty.lineWidth = "0.04";
+
    scene.rotation.y = -.5;
cty.moveTo(0, h/2);
+
    scene.position.y = 8.5;
cty.lineTo(w, h/2);
 
cty.moveTo(0, 0);
 
cty.lineTo(0,h);
 
cty.stroke();
 
//cty.strokeRect(0,0,w,h);
 
 
if (step == 0) {
 
cty.clearRect(0, 0, w, h);
 
}
 
 
var x = 100-5*(3.5 * Math.sin(controls.k1*step*0.0003) -3.74 * Math.sin(controls.k2*step*0.0003));
 
cty.lineWidth="2";
 
cty.beginPath();
 
if (step == 0) {
 
cty.moveTo(0, h/2); }
 
else {
 
cty.moveTo((step -1)/4, x);
 
}
 
cty.lineTo(step/4, x);
 
cty.stroke();
 
 
step += controls.t;
 
  
cube2.rotation.z = 0.2*Math.sin(controls.k1*step*0.0003) - 0.2*Math.sin(controls.k2*step*0.0003);
+
    let T = solution.dt;
            group1.position.y = 0.75*(3.5 * Math.sin(controls.k1*step*0.0003) -3.74 * Math.sin(controls.k2*step*0.0003));
+
    let z =.001;
            spring1.scale.z = 0.1 - 0.008*( 0.75*controls.l*(3.5 * Math.sin(controls.k1*step*0.0003) - 3.74 * Math.sin(controls.k2*step*0.0003)));
+
    let animate;
            spring2.scale.z = 0.1 - 0.02*( 0.75*controls.l*(3.5 * Math.sin(controls.k1*step*0.0003) - 3.74 * Math.sin(controls.k2*step*0.0003)));
+
    animate = function () {
 +
        requestAnimationFrame(animate);
  
            requestAnimationFrame(render);
+
        T = solution.dt;
            renderer.render(scene, camera);
+
        solution.a11 = .5 * (solution.m1 + solution.m2) * Math.pow(solution.R, 2);
 +
        solution.a22 = .5 * (solution.m3 + solution.m4) * Math.pow(solution.R, 2);
 +
        solution.c11 = solution.c1 + solution.c2 / 1.44;
 +
        solution.c22 = solution.c2 / .81 + solution.c3;
 +
        solution.c12 = (1 / (1.2 * .9)) * solution.c2;
 +
        solution.D = Math.sqrt(Math.pow(solution.a11 * solution.c22 + solution.a22 * solution.c11, 2) - 4 * solution.a11 * solution.a22 * (solution.c11 * solution.c22 - Math.pow(solution.c12, 2)));
 +
        solution.k1 = '' + Math.sqrt((solution.a11 * solution.c22 + solution.a22 * solution.c11 + solution.D) / (2 * solution.a11 * solution.a22));
 +
        solution.k2 = '' + Math.sqrt((solution.a11 * solution.c22 + solution.a22 * solution.c11 - solution.D) / (2 * solution.a11 * solution.a22));
 +
        solution.p1 = -(solution.c11 - solution.a11 * Math.pow(solution.k1, 2)) / solution.c12;
 +
        solution.p2 = -(solution.c11 - solution.a11 * Math.pow(solution.k2, 2)) / solution.c12;
 +
 
 +
 
 +
        wheel_1.spin(solution, 1, 1, 1);
 +
        wheel_2.spin(solution, -1, 1.2, 1);
 +
        wheel_3.spin(solution, -1, .9, 2);
 +
        wheel_4.spin(solution, 1, 1, 2);
 +
 
 +
        if (solution.t === 0) {
 +
            z = 0;
 +
        }
 +
        if (solution.t > 450) {
 +
            z -= T;
 
         }
 
         }
          
+
         ctx.clearRect(0, 0, buffer.width, 400);
        function initStats() {
+
        ctx.drawImage(GraphicBulider.bufferDraw(buffer, solution.t, T, Moving_parts.equation(solution, 1, 1, 1, solution.t - T), Moving_parts.equation(solution, 1, 1, 1, solution.t), 'red'), z, 0);
            var stats = new Stats();
+
        ctx1.clearRect(0, 0, buffer.width, 400);
            stats.setMode(0); // 0: fps, 1: ms
+
        ctx1.drawImage(GraphicBulider.bufferDraw(buffer1, solution.t, T, Moving_parts.equation(solution, 1, 1, 0, solution.t - T), Moving_parts.equation(solution, 1, 1, 0, solution.t), 'green'), z, 0);
            stats.domElement.style.position = 'absolute';
+
        solution.t += T;
            stats.domElement.style.left = '0px';
+
        renderer.render(scene, camera);
            stats.domElement.style.top = '0px';
+
    };
 +
    animate();
 +
    const gui = new dat.GUI();
 +
    gui.add(solution, 'm1',20,70).onChange(solution.redraw);
 +
    gui.add(solution, 'm2',20,70).onChange(solution.redraw);
 +
    gui.add(solution, 'm3',20,70).onChange(solution.redraw);
 +
    gui.add(solution, 'm4',20,70).onChange(solution.redraw);
 +
    gui.add(solution, 'c1',0,35000).onChange(solution.redraw);
 +
    gui.add(solution, 'c2',0,35000).onChange(solution.redraw);
 +
    gui.add(solution, 'dt',0,10).onChange(solution.redraw);
  
            document.getElementById("Stats-output").appendChild(stats.domElement);
+
    gui.add(solution, 'k1').listen();
            return stats;
+
    gui.add(solution, 'k2').listen();
        }
+
    gui.add(solution, 'redraw');
     }
+
     solution.redraw();
window.onload = init
 
</script>
 
</body>
 
</html>
 
 
</syntaxhighlight>
 
</syntaxhighlight>
 
</div>
 
</div>

Текущая версия на 20:17, 11 сентября 2018

Условие задачи[править]

Определить частоты малых свободных колебаний и формы главных колебаний системы с двумя степенями свободы, пренебрегая силами сопротивления, массами пружин и моментами инерции скручиваемых валов.

[math]m_1[/math] = 8 кг; [math]m_2[/math] = 10 кг; [math]c_1[/math] = 40 Н⁄см; [math]c_2[/math] = 60 Н⁄см; [math]l[/math] = 0,5 м.

Программа[править]

Код программы[править]

Текст программы:
  1     const scene = new THREE.Scene();
  2     const camera = new THREE.PerspectiveCamera(60, 1, 1, 100);
  3     const renderer = new THREE.WebGLRenderer();
  4 
  5     //Постановка задачи(условия)
  6     const R = 2;
  7     const solution = new function () {
  8         this.c1 = 20000;
  9         this.c2 = 30000;
 10         this.c3 = 10000;
 11         this.R = .2;
 12         this.t = 0;
 13         this.dt = .7;
 14 
 15         this.m1 = 50;
 16         this.m2 = 60;
 17         this.m3 = 40;
 18         this.m4 = 50;
 19 
 20 
 21         this.a11 = .5*(this.m1+this.m2)*Math.pow(this.R,2);
 22         this.a22 = .5*(this.m3+this.m4)*Math.pow(this.R,2);
 23         this.c11 = this.c1+this.c2/1.44;
 24         this.c22 = this.c2/.81 + this.c3;
 25         this.c12 = this.c2/(1.2*.9);
 26         this.D = Math.sqrt(Math.pow(this.a11 * this.c22 + this.a22 * this.c11,2) -4 * this.a11 * this.a22 * (this.c11 * this.c22 - Math.pow(this.c12,2)));
 27         this.k1 = '' + Math.sqrt((this.a11 * this.c22 + this.a22 * this.c11 + this.D)/(2*this.a11*this.a22));
 28         this.k2 = '' + Math.sqrt((this.a11 * this.c22 + this.a22 * this.c11 - this.D)/(2*this.a11*this.a22));
 29 
 30         this.p1 = -(this.c11 - this.a11*Math.pow(this.k1,2))/this.c12;
 31         this.p2 = -(this.c11 - this.a11*Math.pow(this.k2,2))/this.c12;
 32 
 33         let self = this;
 34 
 35         this.redraw = function() {
 36             self.t = 0;
 37             ctx.clearRect(0,-242,500,500);
 38             ctx1.clearRect(0,-242,500,500);
 39         };
 40     };
 41     class Construction {
 42         constructor(geometry,material,x,y,z) {
 43             this.geometry = geometry;
 44             this.material = material;
 45             this.x = x;
 46             this.y = y;
 47             this.z = z;
 48             this.mesh = new THREE.Mesh(geometry,material);
 49         }
 50         build(scene,angleX,angleY,angleZ) {
 51             this.mesh.position.x = this.x;
 52             this.mesh.position.y = this.y;
 53             this.mesh.position.z = this.z;
 54             this.mesh.rotation.x = angleX;
 55             this.mesh.rotation.y = angleY;
 56             this.mesh.rotation.z = angleZ;
 57             scene.add(this.mesh);
 58         }
 59     }
 60 
 61     class Moving_parts extends Construction {
 62         spin(solution,sign,ratio,r) {
 63             let r1 = 1;
 64             let r2 = 1;
 65             if(r !== 1) {
 66                 r1 =  solution.p1;
 67                 r2 =  solution.p2;
 68             }
 69             this.mesh.rotation.x = r1 * sign * Math.sin(solution.k1 * solution.t / 1000) * 2 / ratio + r2 * sign * Math.sin(solution.k2 * solution.t / 1000) * 2 / ratio;
 70         }
 71         static equation(solution,sign,ratio,r,t) {
 72             let r1 = 1;
 73             let r2 = 1;
 74             if(r !== 1) {
 75                 r1 =  solution.p1;
 76                 r2 =  solution.p2;
 77             }
 78             return r1 * sign * Math.sin(solution.k1 * t / 1000) * 50 / ratio + r2 * sign * Math.sin(solution.k2 * t / 1000) * 50 / ratio;
 79         }
 80     }
 81 
 82 
 83     renderer.setClearColor(0xEEEEEE);
 84     renderer.setSize(600, 600);
 85     let main = document.getElementById("canvas_3d");
 86     main.appendChild(renderer.domElement);
 87     renderer.domElement.style.border = "1px solid#000";
 88 
 89 
 90     let gr = new GraphicBulider(450,242);
 91     let ctx = gr.dom("canvas_1");
 92     let gr1 = new GraphicBulider(450,242);
 93     let ctx1 = gr1.dom("canvas_2");
 94     let buffer = GraphicBulider.createBuffer();
 95     let buffer1 = GraphicBulider.createBuffer();
 96 
 97 
 98     const spotLight = new THREE.SpotLight( 0xffffff );
 99     spotLight.position.set( 50, 80, 20 );
100     scene.add(spotLight);
101 
102     const axes = new THREE.AxisHelper( 20 );
103     scene.add(axes);
104 
105     //Условия задачи
106     let wall_1 = new Construction(new THREE.CubeGeometry(10,5,1),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),0,0,0);
107     let shaft_1 = new Construction(new THREE.CylinderGeometry(.5,.5,10,20,10),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),5.5,0,0);
108     let wheel_1 = new Moving_parts(new THREE.CylinderGeometry(2*R,2*R,1,20,5),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: true}),11,0,0);
109     let wheel_2 = new Moving_parts(new THREE.CylinderGeometry(2*R*1.2,2*R*1.2,1,20,5),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: true}),11,-(2*R+1.2*R*2),0);
110     let shaft_2 = new Construction(new THREE.CylinderGeometry(.5,.5,10,20,10),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),16.5,-(2*R+1.2*R*2),0);
111     let wheel_3 = new Moving_parts(new THREE.CylinderGeometry(2*R*.9,2*R*.9,1,20,5),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: true}),22,-(2*R+1.2*R*2),0);
112     let wheel_4 = new Moving_parts(new THREE.CylinderGeometry(2*R,2*R,1,20,5),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: true}),22,-(2*R+1.2*R*2+.9*R*2+2*R),0);
113     let shaft_3 = new Construction(new THREE.CylinderGeometry(.5,.5,5,20,10),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),19,-(2*R+1.2*R*2+.9*R*2+2*R),0);
114     let wall_2 = new Construction(new THREE.CubeGeometry(10,5,1),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),17,-(2*R+1.2*R*2+.9*R*2+2*R),0);
115     wall_1.build(scene,0,Math.PI/2,0);
116     shaft_1.build(scene,0,0,Math.PI/2);
117     wheel_1.build(scene,0,0,Math.PI/2);
118     wheel_2.build(scene,0,0,Math.PI/2);
119     shaft_2.build(scene,0,0,Math.PI/2);
120     wheel_3.build(scene,0,0,Math.PI/2);
121     wheel_4.build(scene,0,0,Math.PI/2);
122     shaft_3.build(scene,0,0,Math.PI/2);
123     wall_2.build(scene,0,Math.PI/2,0);
124 
125     camera.position.x = 20;
126     camera.position.y = 10;
127     camera.position.z = 40;
128     camera.lookAt(scene.position);
129     scene.rotation.y = -.5;
130     scene.position.y = 8.5;
131 
132     let T = solution.dt;
133     let z =.001;
134     let animate;
135     animate = function () {
136         requestAnimationFrame(animate);
137 
138         T = solution.dt;
139         solution.a11 = .5 * (solution.m1 + solution.m2) * Math.pow(solution.R, 2);
140         solution.a22 = .5 * (solution.m3 + solution.m4) * Math.pow(solution.R, 2);
141         solution.c11 = solution.c1 + solution.c2 / 1.44;
142         solution.c22 = solution.c2 / .81 + solution.c3;
143         solution.c12 = (1 / (1.2 * .9)) * solution.c2;
144         solution.D = Math.sqrt(Math.pow(solution.a11 * solution.c22 + solution.a22 * solution.c11, 2) - 4 * solution.a11 * solution.a22 * (solution.c11 * solution.c22 - Math.pow(solution.c12, 2)));
145         solution.k1 = '' + Math.sqrt((solution.a11 * solution.c22 + solution.a22 * solution.c11 + solution.D) / (2 * solution.a11 * solution.a22));
146         solution.k2 = '' + Math.sqrt((solution.a11 * solution.c22 + solution.a22 * solution.c11 - solution.D) / (2 * solution.a11 * solution.a22));
147         solution.p1 = -(solution.c11 - solution.a11 * Math.pow(solution.k1, 2)) / solution.c12;
148         solution.p2 = -(solution.c11 - solution.a11 * Math.pow(solution.k2, 2)) / solution.c12;
149 
150 
151         wheel_1.spin(solution, 1, 1, 1);
152         wheel_2.spin(solution, -1, 1.2, 1);
153         wheel_3.spin(solution, -1, .9, 2);
154         wheel_4.spin(solution, 1, 1, 2);
155 
156         if (solution.t === 0) {
157             z = 0;
158         }
159         if (solution.t > 450) {
160             z -= T;
161         }
162         ctx.clearRect(0, 0, buffer.width, 400);
163         ctx.drawImage(GraphicBulider.bufferDraw(buffer, solution.t, T, Moving_parts.equation(solution, 1, 1, 1, solution.t - T), Moving_parts.equation(solution, 1, 1, 1, solution.t), 'red'), z, 0);
164         ctx1.clearRect(0, 0, buffer.width, 400);
165         ctx1.drawImage(GraphicBulider.bufferDraw(buffer1, solution.t, T, Moving_parts.equation(solution, 1, 1, 0, solution.t - T), Moving_parts.equation(solution, 1, 1, 0, solution.t), 'green'), z, 0);
166         solution.t += T;
167         renderer.render(scene, camera);
168     };
169     animate();
170     const gui = new dat.GUI();
171     gui.add(solution, 'm1',20,70).onChange(solution.redraw);
172     gui.add(solution, 'm2',20,70).onChange(solution.redraw);
173     gui.add(solution, 'm3',20,70).onChange(solution.redraw);
174     gui.add(solution, 'm4',20,70).onChange(solution.redraw);
175     gui.add(solution, 'c1',0,35000).onChange(solution.redraw);
176     gui.add(solution, 'c2',0,35000).onChange(solution.redraw);
177     gui.add(solution, 'dt',0,10).onChange(solution.redraw);
178 
179     gui.add(solution, 'k1').listen();
180     gui.add(solution, 'k2').listen();
181     gui.add(solution, 'redraw');
182     solution.redraw();

Используемые библиотеки[править]

  • three.js
  • CurveExtras1.js
  • stats.min.js
  • dat.gui.js
  • OrbitControls.js

Скачать работу[править]