Редактирование: Задача Д.24, вариант 20 из Задачника Яблонского

Перейти к: навигация, поиск

Внимание! Вы не авторизовались на сайте. Ваш IP-адрес будет публично видимым, если вы будете вносить любые правки. Если вы войдёте или создадите учётную запись, правки вместо этого будут связаны с вашим именем пользователя, а также у вас появятся другие преимущества.

Правка может быть отменена. Пожалуйста, просмотрите сравнение версий, чтобы убедиться, что это именно те изменения, которые вас интересуют, и нажмите «Записать страницу», чтобы изменения вступили в силу.
Текущая версия Ваш текст
Строка 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">
     const scene = new THREE.Scene();
+
<!DOCTYPE html>
     const camera = new THREE.PerspectiveCamera(60, 1, 1, 100);
+
<html>
     const renderer = new THREE.WebGLRenderer();
+
<head>
 +
    <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;
 
  
        this.m1 = 50;
+
    function init() {
        this.m2 = 60;
 
        this.m3 = 40;
 
        this.m4 = 50;
 
  
 +
        var stats = initStats();
  
         this.a11 = .5*(this.m1+this.m2)*Math.pow(this.R,2);
+
         var scene = new THREE.Scene();
        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));
 
  
         this.p1 = -(this.c11 - this.a11*Math.pow(this.k1,2))/this.c12;
+
         var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 1000);
        this.p2 = -(this.c11 - this.a11*Math.pow(this.k2,2))/this.c12;
 
  
         let self = this;
+
         var renderer = new THREE.WebGLRenderer();
  
         this.redraw = function() {
+
         renderer.setClearColor(new THREE.Color(0xEEEEEE));
            self.t = 0;
+
        renderer.setSize(window.innerWidth, window.innerHeight);
            ctx.clearRect(0,-242,500,500);
+
            ctx1.clearRect(0,-242,500,500);
+
var orbitControls = new THREE.OrbitControls(camera);
         };
+
         orbitControls.autoRotate = true;
    };
+
       
    class Construction {
+
var planeGeometry = new THREE.PlaneGeometry(10,20,1,1);
        constructor(geometry,material,x,y,z) {
+
        var planeMaterial = new THREE.MeshLambertMaterial({color: 0xffffff});
            this.geometry = geometry;
+
        var plane1 = new THREE.Mesh(planeGeometry,planeMaterial);
            this.material = material;
+
var plane2 = new THREE.Mesh(planeGeometry,planeMaterial);
            this.x = x;
+
            this.y = y;
+
plane1.rotation.y = -0.5*Math.PI;
            this.z = z;
+
        plane1.position.x = -10;
            this.mesh = new THREE.Mesh(geometry,material);
+
scene.add(plane1);
        }
+
plane1.receiveShadow = true;
        build(scene,angleX,angleY,angleZ) {
+
            this.mesh.position.x = this.x;
+
        plane2.rotation.y = -0.5*Math.PI;
            this.mesh.position.y = this.y;
+
plane2.position.x = 10;
            this.mesh.position.z = this.z;
+
scene.add(plane2);
            this.mesh.rotation.x = angleX;
+
plane2.receiveShadow = true;
            this.mesh.rotation.y = angleY;
+
            this.mesh.rotation.z = angleZ;
+
var cubeGeometry1 = new THREE.CubeGeometry(18,7,5);
            scene.add(this.mesh);
+
         var cubeMaterial1 = new THREE.MeshLambertMaterial({color: 0xffff00});
         }
+
        var cube1 = new THREE.Mesh(cubeGeometry1, cubeMaterial1);
    }
+
        cube1.castShadow = true;
  
    class Moving_parts extends Construction {
+
var cubeGeometry2 = new THREE.CubeGeometry(17.5,1,2);
        spin(solution,sign,ratio,r) {
+
        var cubeMaterial2 = new THREE.MeshLambertMaterial({color: 0x00ffff});
            let r1 = 1;
+
var cube2 = new THREE.Mesh(cubeGeometry2, cubeMaterial2);
            let r2 = 1;
+
        cube2.castShadow = true;
            if(r !== 1) {
+
cube2.position.x = 3.75;
                r1 = solution.p1;
+
cube2.position.y = 20;
                r2 = solution.p2;
+
cube2.geometry.translate(-3.75,0,0);
            }
+
        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;
  
    renderer.setClearColor(0xEEEEEE);
+
        var cylinderGeometry1 = new THREE.CylinderGeometry(0.5, 1.5, 2, 4, 4);
    renderer.setSize(600, 600);
+
var cylinder5 = new THREE.Mesh(cylinderGeometry1, cylinderMaterial);
    let main = document.getElementById("canvas_3d");
+
cylinder5.rotation.y = -1.25*Math.PI;
    main.appendChild(renderer.domElement);
+
cylinder5.position.x = 3.75;
    renderer.domElement.style.border = "1px solid#000";
+
cylinder5.position.y = 18.5;
 +
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));
  
    let gr = new GraphicBulider(450,242);
+
        var ambientLight = new THREE.AmbientLight(0x0c0c0c);
    let ctx = gr.dom("canvas_1");
+
        scene.add(ambientLight);
    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);
  
    const spotLight = new THREE.SpotLight( 0xffffff );
+
        document.getElementById("WebGL-output").appendChild(renderer.domElement);
    spotLight.position.set( 50, 80, 20 );
+
       
    scene.add(spotLight);
+
var step = 0;
 +
        var scalingStep = 0;
 +
         
 +
        var controls = new function () {
 +
        this.t = 1;
 +
       
 +
        this.c1 = 40*100;
 +
        this.c2 = 60*100;
 +
        this.l = 0.5;
  
    const axes = new THREE.AxisHelper( 20 );
+
            this.m1 = 8;
    scene.add(axes);
+
            this.m2 = 10;
 +
           
 +
           
 +
            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() ;  
    let wall_1 = new Construction(new THREE.CubeGeometry(10,5,1),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),0,0,0);
+
        gui.add(controls, 'k2').listen() ;
    let shaft_1 = new Construction(new THREE.CylinderGeometry(.5,.5,10,20,10),new THREE.MeshLambertMaterial({color: 0xff0000,wireframe: false}),5.5,0,0);
+
gui.add(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);
+
controls.redraw();
    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);
+
       
    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);
+
        render();
    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);
+
       
    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);
+
function render() {
    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);
+
            stats.update();
    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);
+
           
    wall_1.build(scene,0,Math.PI/2,0);
+
controls.a11 = controls.m2;
    shaft_1.build(scene,0,0,Math.PI/2);
+
            controls.a22 = 19/12 * controls.m1 * controls.l * controls.l;
    wheel_1.build(scene,0,0,Math.PI/2);
+
            controls.c11 = controls.c1 + controls.c2;
    wheel_2.build(scene,0,0,Math.PI/2);
+
            controls.c22 = 6.25 * controls.c1 * controls.l * controls.l + controls.c2* controls.l * controls.l;
    shaft_2.build(scene,0,0,Math.PI/2);
+
            controls.c12 = (2 * controls.c2 * controls.l - 5 * controls.c1 * controls.l)/2;
    wheel_3.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_4.build(scene,0,0,Math.PI/2);
+
-4*controls.a11 * controls.a22*(controls.c11 * controls.c22 - controls.c12 * controls.c12));
    shaft_3.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));
    wall_2.build(scene,0,Math.PI/2,0);
+
            controls.k2 = '' + Math.sqrt((controls.a11 * controls.c22 + controls.a22 * controls.c11 - controls.D)/(2*controls.a11*controls.a22));
 +
  
    camera.position.x = 20;
+
var cty = canvas_example2.getContext("2d");
    camera.position.y = 10;
+
var w = canvas_example2.width;
    camera.position.z = 40;
+
var h = canvas_example2.height;
    camera.lookAt(scene.position);
+
    scene.rotation.y = -.5;
+
cty.lineWidth = "0.04";
    scene.position.y = 8.5;
+
cty.moveTo(0, h/2);
 +
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;
  
    let T = solution.dt;
+
cube2.rotation.z = 0.2*Math.sin(controls.k1*step*0.0003) - 0.2*Math.sin(controls.k2*step*0.0003);
    let z =.001;
+
            group1.position.y = 0.75*(3.5 * Math.sin(controls.k1*step*0.0003) -3.74 * Math.sin(controls.k2*step*0.0003));
    let animate;
+
            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)));
    animate = function () {
+
            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)));
        requestAnimationFrame(animate);
 
  
        T = solution.dt;
+
            requestAnimationFrame(render);
        solution.a11 = .5 * (solution.m1 + solution.m2) * Math.pow(solution.R, 2);
+
            renderer.render(scene, camera);
        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;
+
        function initStats() {
        solution.c12 = (1 / (1.2 * .9)) * solution.c2;
+
            var stats = new Stats();
        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)));
+
            stats.setMode(0); // 0: fps, 1: ms
        solution.k1 = '' + Math.sqrt((solution.a11 * solution.c22 + solution.a22 * solution.c11 + solution.D) / (2 * solution.a11 * solution.a22));
+
            stats.domElement.style.position = 'absolute';
        solution.k2 = '' + Math.sqrt((solution.a11 * solution.c22 + solution.a22 * solution.c11 - solution.D) / (2 * solution.a11 * solution.a22));
+
            stats.domElement.style.left = '0px';
        solution.p1 = -(solution.c11 - solution.a11 * Math.pow(solution.k1, 2)) / solution.c12;
+
            stats.domElement.style.top = '0px';
        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) {
+
            document.getElementById("Stats-output").appendChild(stats.domElement);
             z = 0;
+
             return stats;
 
         }
 
         }
        if (solution.t > 450) {
+
    }
            z -= T;
+
window.onload = init
        }
+
</script>
        ctx.clearRect(0, 0, buffer.width, 400);
+
</body>
        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);
+
</html>
        ctx1.clearRect(0, 0, buffer.width, 400);
 
        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);
 
        solution.t += T;
 
        renderer.render(scene, camera);
 
    };
 
    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);
 
 
 
    gui.add(solution, 'k1').listen();
 
    gui.add(solution, 'k2').listen();
 
    gui.add(solution, 'redraw');
 
    solution.redraw();
 
 
</syntaxhighlight>
 
</syntaxhighlight>
 
</div>
 
</div>
Вам запрещено изменять защиту статьи. Edit Создать редактором

Обратите внимание, что все добавления и изменения текста статьи рассматриваются как выпущенные на условиях лицензии Public Domain (см. Department of Theoretical and Applied Mechanics:Авторские права). Если вы не хотите, чтобы ваши тексты свободно распространялись и редактировались любым желающим, не помещайте их сюда.
Вы также подтверждаете, что являетесь автором вносимых дополнений или скопировали их из источника, допускающего свободное распространение и изменение своего содержимого.
НЕ РАЗМЕЩАЙТЕ БЕЗ РАЗРЕШЕНИЯ МАТЕРИАЛЫ, ОХРАНЯЕМЫЕ АВТОРСКИМ ПРАВОМ!

To protect the wiki against automated edit spam, we kindly ask you to solve the following CAPTCHA:

Отменить | Справка по редактированию  (в новом окне)