Текущая версия |
Ваш текст |
Строка 1: |
Строка 1: |
| '''''Задача:''''' С помощью языка программирования JavaScript смоделировать систему блоков с грузом. | | '''''Задача:''''' С помощью языка программирования JavaScript смоделировать систему блоков с грузом. |
| [[Файл:Blocks.png|thumb|Система блоков с грузом (1 - подвижный блок, 2 - неподвижный блок, 3 - груз.)]] | | [[Файл:Blocks.png|thumb|Система блоков с грузом (1 - подвижный блок, 2 - неподвижный блок, 3 - груз.)]] |
− |
| |
− | == Решение ==
| |
− |
| |
− | {{#widget:Iframe |url=http://tm.spbstu.ru/htmlets/Shvarev/5.html |width=800 |height=600 |border=0 }}
| |
− |
| |
− | Программа: [[Медиа: Blocks.zip|скачать]]
| |
− |
| |
− | <div class="mw-collapsible mw-collapsed">
| |
− | '''Текст программы на языке JavaScript:''' <div class="mw-collapsible-content">
| |
− | Файл '''"5.js"'''
| |
− | <syntaxhighlight lang="javascript" line start="1" enclose="div">
| |
− | function main()
| |
− | {
| |
− | var scene = new THREE.Scene();
| |
− | var camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 0.1, 1000);
| |
− | var render = new THREE.WebGLRenderer();
| |
− | render.setClearColor(0xEEEEEE, 1);
| |
− | render.setSize(window.innerWidth, window.innerHeight);
| |
− |
| |
− |
| |
− | var axes = new THREE.AxisHelper(20);
| |
− | scene.add(axes);
| |
− |
| |
− |
| |
− | var planeGeometry = new THREE.PlaneGeometry(60,40,50,1);
| |
− | var planeMaterial = new THREE.MeshLambertMaterial({color:0x6699FF});
| |
− | var plane = new THREE.Mesh(planeGeometry, planeMaterial);
| |
− | plane.rotation.x = -0.5*Math.PI;
| |
− | plane.position.x=15;
| |
− | plane.position.y=0;
| |
− | plane.position.z=14;
| |
− | scene.add(plane);
| |
− |
| |
− |
| |
− | var planeGeometry = new THREE.PlaneGeometry(20,60,50,1);
| |
− | var planeMaterial = new THREE.MeshLambertMaterial({color:0xffffff});
| |
− | var plane1 = new THREE.Mesh(planeGeometry, planeMaterial);
| |
− | plane1.rotation.z = -0.5*Math.PI;
| |
− | plane1.position.x=15;
| |
− | plane1.position.y=10;
| |
− | plane1.position.z=-6;
| |
− | scene.add(plane1);
| |
− |
| |
− |
| |
− | var boxGeometry1 = new THREE.BoxGeometry(0.1,4,16);
| |
− | var boxMaterial1 = new THREE.MeshLambertMaterial({color:0xE5DD06, wireframe:false});
| |
− | var cube1 = new THREE.Mesh(boxGeometry1, boxMaterial1);
| |
− | cube1.position.x=8;
| |
− | cube1.position.y=10;
| |
− | cube1.position.z=2;
| |
− | scene.add(cube1);
| |
− |
| |
− | var boxGeometry2 = new THREE.BoxGeometry(0.1,4,10);
| |
− | var boxMaterial2 = new THREE.MeshLambertMaterial({color:0xE5DD06, wireframe:false});
| |
− | var cube2 = new THREE.Mesh(boxGeometry2, boxMaterial2);
| |
− | cube2.position.x=16;
| |
− | cube2.position.y=10;
| |
− | cube2.position.z=5;
| |
− | scene.add(cube2);
| |
− |
| |
− | var boxGeometry3 = new THREE.BoxGeometry(0.1,4,8);
| |
− | var boxMaterial3 = new THREE.MeshLambertMaterial({color:0xE5DD06, wireframe:false});
| |
− | var cube3 = new THREE.Mesh(boxGeometry3, boxMaterial3);
| |
− | cube3.position.x=24;
| |
− | cube3.position.y=10;
| |
− | cube3.position.z=4;
| |
− | scene.add(cube3);
| |
− |
| |
− |
| |
− |
| |
− |
| |
− | /**
| |
− | var cubeGeometry = new THREE.CubeGeometry(4,4,4);
| |
− | var cubeMesh = new THREE.MeshLambertMaterial({color:0xff0000, wireframe:false});
| |
− | var cube = new THREE.Mesh(cubeGeometry, cubeMesh);
| |
− | cube.position.x=-4;
| |
− | cube.position.y=3;
| |
− | cube.position.z=0;
| |
− | scene.add(cube);
| |
− |
| |
− |
| |
− | var cylinderGeometry = new THREE.CylinderGeometry(4,4,5,16);
| |
− | var cylinderMaterial = new THREE.MeshLambertMaterial({color:0xaaee00});
| |
− | var cylinder = new THREE.Mesh(cylinderGeometry, cylinderMaterial)
| |
− | cylinder.position.x=10;
| |
− | cylinder.position.y=10;
| |
− | cylinder.position.z=0;
| |
− |
| |
− | scene.add(cylinder);
| |
− | */
| |
− |
| |
− |
| |
− | var cylinderGeometry = new THREE.CylinderGeometry(4,4,4,32);
| |
− | var cylinderMaterial = new THREE.MeshLambertMaterial({color:0xff0000, wireframe: false});
| |
− |
| |
− | var cylinder1 = new THREE.Mesh(cylinderGeometry, cylinderMaterial)
| |
− | cylinder1.position.x=12;
| |
− | cylinder1.position.y=10;
| |
− | cylinder1.position.z=10;
| |
− | scene.add(cylinder1);
| |
− |
| |
− | var cylinder2 = new THREE.Mesh(cylinderGeometry, cylinderMaterial)
| |
− | cylinder2.position.x=20;
| |
− | cylinder2.position.y=10;
| |
− | cylinder2.position.z=0;
| |
− | scene.add(cylinder2);
| |
− |
| |
− | var semiCylinderGeometry1 = new THREE.CylinderGeometry(4,4,4,32, 1,true, -Math.PI/2, Math.PI);
| |
− | var semiCylinderGeometry2 = new THREE.CylinderGeometry(4,4,4,32, 1,true, Math.PI/2, Math.PI);
| |
− | var semiCylinderMaterial = new THREE.MeshLambertMaterial({color:0xE5DD06, wireframe: false});
| |
− | var semiCylinder1 = new THREE.Mesh(semiCylinderGeometry1, semiCylinderMaterial)
| |
− | var semiCylinder2 = new THREE.Mesh(semiCylinderGeometry2, semiCylinderMaterial)
| |
− |
| |
− | semiCylinder1.position.x=12;
| |
− | semiCylinder1.position.y=10;
| |
− | semiCylinder1.position.z=10;
| |
− | scene.add(semiCylinder1);
| |
− |
| |
− | semiCylinder2.position.x=20;
| |
− | semiCylinder2.position.y=10;
| |
− | semiCylinder2.position.z=0;
| |
− | scene.add(semiCylinder2);
| |
− |
| |
− |
| |
− | var pyrGeometry = new THREE.CylinderGeometry(4,4,4,3);
| |
− | var pyrMaterial = new THREE.MeshLambertMaterial({color:0xff8800, wireframe:false});
| |
− | var pyr = new THREE.Mesh(pyrGeometry, pyrMaterial)
| |
− | pyr.position.x=20;
| |
− | pyr.position.y=10;
| |
− | pyr.position.z=-4;
| |
− | scene.add(pyr);
| |
− |
| |
− |
| |
− | var cubeGeometry = new THREE.CubeGeometry(4,4,2);
| |
− | var cubeMesh = new THREE.MeshLambertMaterial({color:0xff0000, wireframe:false});
| |
− | var cube = new THREE.Mesh(cubeGeometry, cubeMesh);
| |
− | cube.position.x=24;
| |
− | cube.position.y=10;
| |
− | cube.position.z=9;
| |
− | scene.add(cube);
| |
− |
| |
− |
| |
− | /**
| |
− | var line_geometry = new THREE.Geometry();
| |
− | line_geometry.vertices.push(new THREE.Vector3(16,10,0));
| |
− | line_geometry.vertices.push(new THREE.Vector3(16,10,10));
| |
− | var material_line = new THREE.LineBasicMaterial({ color: 0x6699FF, linewidth: 5000, fog:false});
| |
− | var line1 = new THREE.Line(line_geometry,material_line);
| |
− | scene.add( line1);
| |
− |
| |
− |
| |
− | var line_geometry = new THREE.Geometry();
| |
− | line_geometry.vertices.push(new THREE.Vector3(8,10,10));
| |
− | line_geometry.vertices.push(new THREE.Vector3(8,10,-6));
| |
− | var material_line = new THREE.LineBasicMaterial({ color: 0x6699FF, linewidth: 5000, fog:false});
| |
− | var line2 = new THREE.Line(line_geometry,material_line);
| |
− | scene.add(line2);
| |
− |
| |
− | var line_geometry = new THREE.Geometry();
| |
− | line_geometry.vertices.push(new THREE.Vector3(24,10,0));
| |
− | line_geometry.vertices.push(new THREE.Vector3(24,10,8));
| |
− | var material_line = new THREE.LineBasicMaterial({ color: 0x6699FF, linewidth: 5000, fog:false});
| |
− | var line3 = new THREE.Line(line_geometry,material_line);
| |
− | scene.add(line3);
| |
− |
| |
− | */
| |
− |
| |
− | var spotLight = new THREE.SpotLight(0xffffff);
| |
− | spotLight.position.set(0,100,0);
| |
− | scene.add(spotLight);
| |
− |
| |
− | var spotLight1 = new THREE.SpotLight(0xffffff);
| |
− | spotLight1.position.set(50,100,30);
| |
− | scene.add(spotLight1);
| |
− |
| |
− |
| |
− |
| |
− | render.shadowMapEnabled = true;
| |
− | plane.receiveShadow = true;
| |
− |
| |
− | /**
| |
− | cube.castShadow = true;
| |
− | cylinder.castShadow = true;
| |
− | */
| |
− | spotLight.castShadow = true;
| |
− |
| |
− |
| |
− |
| |
− |
| |
− |
| |
− | camera.position.x= 0;
| |
− | camera.position.y= 100;
| |
− | camera.position.z= 0;
| |
− | camera.lookAt(scene.position);
| |
− | $("#webGL").append(render.domElement);
| |
− |
| |
− |
| |
− |
| |
− | var controls = new function() {
| |
− | this.bouncingSpeed = 0.03;
| |
− | this.r1 = 2;
| |
− | }
| |
− | var gui = new dat.GUI();
| |
− | gui.add(controls, 'bouncingSpeed',0,0.5);
| |
− | gui.add(controls, 'r1',1,2.5);
| |
− |
| |
− | contr = new THREE.OrbitControls(camera);
| |
− | contr.dumping = 0.2;
| |
− |
| |
− |
| |
− |
| |
− | /**contr = new THREE.TrackballControls(camera);
| |
− | contr.rotateSpeed = 1.0;
| |
− | contr.zoomSpeed = 1.2;
| |
− | contr.panSpeed = 0.8;
| |
− | contr.noZoom = false;
| |
− | contr.noPan = false;
| |
− | contr.staticMoving = true;
| |
− | contr.dynamicDampingFactor = 0.3;
| |
− | contr.keys = [65,83,68];
| |
− | */
| |
− |
| |
− |
| |
− | window.addEventListener('resize',onWindowResize,false);
| |
− | function onWindowResize()
| |
− | {
| |
− | camera.aspect = window.innerWidth/window.innerHeight;
| |
− | camera.updateProjectionMatrix();
| |
− | render.setSize(window.innerWidth,window.innerHeight);
| |
− |
| |
− | renderer();
| |
− | }
| |
− |
| |
− | var stats = initStats();
| |
− | var step = 0;
| |
− |
| |
− | var z1 =16;
| |
− | var z2 = 10;
| |
− | var z3 = 8;
| |
− |
| |
− | var r2 = 2;
| |
− |
| |
− | var r1 = 2;
| |
− |
| |
− |
| |
− | function renderer()
| |
− | {
| |
− | /**
| |
− | cube.rotation.x+=controls.rotationSpeed;
| |
− | cube.rotation.y+=controls.rotationSpeed;
| |
− | cube.rotation.z+=controls.rotationSpeed;
| |
− |
| |
− | cylinder.position.x = 20+(10*(Math.cos(step)));
| |
− | cylinder.position.y = 2+(10*(Math.abs(Math.sin(step))));
| |
− |
| |
− |
| |
− | */
| |
− |
| |
− |
| |
− | step+=controls.bouncingSpeed;
| |
− | step1 = step/100;
| |
− | step2 = step/200;
| |
− |
| |
− | r1 = controls.r1;
| |
− | r2 = 4 - r1;
| |
− |
| |
− | var geometryCylinder2 = new THREE.CylinderGeometry(2*r1,2*r1,4,32);
| |
− | var geometryCylinder1 = new THREE.CylinderGeometry(2*r2,2*r2,4,32);
| |
− |
| |
− | cylinder2.geometry = geometryCylinder2;
| |
− | cylinder1.geometry = geometryCylinder1;
| |
− |
| |
− |
| |
− |
| |
− | var semiGeometryCylinder2 = new THREE.CylinderGeometry(2*r1,2*r1,4,32, 1,true, Math.PI/2, Math.PI);
| |
− | var semiGeometryCylinder1 = new THREE.CylinderGeometry(2*r2,2*r2,4,32, 1,true, -Math.PI/2, Math.PI);
| |
− |
| |
− | semiCylinder2.geometry = semiGeometryCylinder2;
| |
− | semiCylinder1.geometry = semiGeometryCylinder1;
| |
− |
| |
− |
| |
− | z1 -=step2;
| |
− | z2 -=step2;
| |
− | z3 +=step1;
| |
− | var geometry1 = new THREE.BoxGeometry( 0.01, 4, z1 );
| |
− | var geometry2 = new THREE.BoxGeometry( 0.01, 4, z2 );
| |
− | var geometry3 = new THREE.BoxGeometry( 0.01, 4, z3 );
| |
− | cube1.position.x =12 - 2*r2;
| |
− | cube2.position.x = 12 + 2*r2;
| |
− | cube3.position.x = 20 + 2*r1;
| |
− | if ( cube2.position.z >= cylinder2.position.z)
| |
− | {
| |
− |
| |
− |
| |
− |
| |
− | cube1.geometry = geometry1;
| |
− | cube1.position.z -= step2/2;
| |
− |
| |
− |
| |
− |
| |
− | cube2.geometry = geometry2;
| |
− | cube2.position.z -= step2/2;
| |
− |
| |
− | cube3.geometry = geometry3;
| |
− | cube3.position.z += step1/2;
| |
− |
| |
− |
| |
− |
| |
− | cylinder1.rotation.y+=step2/2;
| |
− | cylinder2.rotation.y-=step1/2;
| |
− |
| |
− |
| |
− |
| |
− | /**
| |
− | line3.geometry.vertices[1].z += step1 ;
| |
− | line3.geometry.verticesNeedUpdate = true;
| |
− |
| |
− | line2.geometry.vertices[0].z -= step2 ;
| |
− |
| |
− | line2.geometry.verticesNeedUpdate = true;
| |
− |
| |
− |
| |
− | line1.geometry.vertices[1].z -= step2 ;
| |
− | line1.geometry.verticesNeedUpdate = true;
| |
− |
| |
− | */
| |
− |
| |
− | cylinder1.position.z -= step2;
| |
− |
| |
− |
| |
− |
| |
− |
| |
− |
| |
− | semiCylinder1.position.z -=step2;
| |
− |
| |
− | cube.position.z += step1;
| |
− | }
| |
− |
| |
− |
| |
− | document.getElementById("td1").innerHTML = cube2.position.z ;
| |
− |
| |
− | requestAnimationFrame(renderer);
| |
− |
| |
− | contr.update();
| |
− |
| |
− | render.render(scene,camera);
| |
− |
| |
− |
| |
− |
| |
− |
| |
− | }
| |
− | this.start = renderer;
| |
− |
| |
− |
| |
− | }
| |
− | function initStats()
| |
− | {
| |
− | var stats = new Stats();
| |
− | stats.setMode(0);
| |
− | stats.domElement.style.position='absolute';
| |
− | stats.domElement.style.left = '0px';
| |
− | stats.domElement.style.top = '0px';
| |
− | $("#Stats").append(stats.domElement);
| |
− | return stats;
| |
− | }
| |
− |
| |
− |
| |
− | </syntaxhighlight>
| |
− | </div>
| |
| | | |
| == Используемые библиотеки == | | == Используемые библиотеки == |
Строка 394: |
Строка 25: |
| | | |
| '''''Решение:''''' | | '''''Решение:''''' |
− |
| |
| <math>C</math> - мгновенный центр скоростей, <math>v_{C} = 0</math>; | | <math>C</math> - мгновенный центр скоростей, <math>v_{C} = 0</math>; |
− | | + | <math>v_{K} = v_{D} = \dot{x} = 4 м/c</math> |
− | <math>v_{K} = v_{D} = \dot{x} = 4</math> м/c; | |
− | | |
− | <math>ω = \frac{v_{D}}{DC} = \frac{4}{0.4} = 10 c^{-1} </math>;
| |
− | | |
− | <math> v_{O} = ω*r = 10*0.2 = 2</math> м/c.
| |
| | | |
| == См. также == | | == См. также == |