Мещерский. Задача 4.57 — различия между версиями

Материал из Department of Theoretical and Applied Mechanics
Перейти к: навигация, поиск
(Новая страница: «'''Мещерский. Задача 4.57''' Визуализация 3D-задачи по статике на JavaScript Исполнитель: Тимоше…»)
 
Строка 7: Строка 7:
 
Группа 23604/1
 
Группа 23604/1
 
Кафедра Теоретической механики
 
Кафедра Теоретической механики
 +
 +
==Формулировка задачи==
 +
 +
Два гладких однородных шара С<sub>1</sub> и С<sub>2</sub>, радиусы которых R<sub>1</sub> и R<sub>2</sub>, а веса P<sub>1</sub> и P<sub>2</sub>, подвешены на веревках AB и AD в точке A; AB = l<sub>1</sub>; AD = l<sub>2</sub>; l<sub>1</sub> + R<sub>1</sub>= l<sub>2</sub> + R<sub>2</sub>; угол BAD = α. Определить угол θ, образуемый веревкой AD с горизонтальной плоскостью AE, натяжения веревок T<sub>1</sub>, T<sub>2</sub> и силу давления одного шара на другой.
 +
 +
 +
 +
==Решение задачи==
 +
 +
{{#widget:Iframe |url=http://tm.spbstu.ru/htmlets/Timoshenko/Mesherskyi/Mesherskyi457.html |width=830 |height=600 |border=0 }}
 +
 +
 +
<div class="mw-collapsible mw-collapsed" style="width:100%" >
 +
<syntaxhighlight lang="javascript" line start="1" enclose="div">
 +
 +
<!DOCTYPE html>
 +
 +
<head>
 +
<script src = "http://tm.spbstu.ru/htmlets/Timoshenko/Mesherskyi/three.js">
 +
</script>
 +
<script src = "http://tm.spbstu.ru/htmlets/Timoshenko/Mesherskyi/stats.min.js">
 +
</script>
 +
<script src = "http://tm.spbstu.ru/htmlets/Timoshenko/Mesherskyi/OrbitControls.js" >
 +
</script>
 +
<script src = "http://tm.spbstu.ru/htmlets/Timoshenko/Mesherskyi/dat.gui.js">
 +
</script>
 +
    <style>
 +
        body {
 +
            margin: 0;
 +
            overflow: hidden;
 +
        }
 +
    </style>
 +
 +
    <body>
 +
 +
        <div id="WebGL"> </div>
 +
        <div id="Stats-output"> </div>
 +
 +
        <script>
 +
            var renderer, camera, scene, stats, controls;
 +
 +
            function init(){
 +
            scene = new THREE.Scene(); //сцена
 +
            camera = new THREE.PerspectiveCamera(10, window.innerWidth / window.innerHeight, 0.1, 1000); //камера
 +
            renderer = new THREE.WebGLRenderer();
 +
            renderer.setClearColor(0xEEEEEE, 1.0); //цвет
 +
            renderer.setSize(window.innerWidth, window.innerHeight); //задаем размеры рендерера
 +
            renderer.shadowMap.enabled = true;
 +
 +
controls = new function() { //функция контроля параметров
 +
this.Weight1 = 20; //вес шара слева
 +
            this.Weight2 = 10; //вес шара справа
 +
            this.Alfa = 0.02;  //угол между нитями
 +
this.Radius1=1;    //радиус шара слева
 +
this.Coefficient=1.5; //коэффициент связи радиусов шаров
 +
this.Radius2=this.Radius1; //радиус шара справа
 +
this.Length1= "Length1 =";  //длина нити слева
 +
this.Length2= "Length2 =";  // длина нити справа
 +
this.Alfa= "Alfa =";  //угол между нитями
 +
this.Tetta = "Tetta ="; //угол между нитью и плоскостью
 +
            this.T1 = "T1 = ";  //сила нятажения нити слева
 +
this.T2 = "T2 = ";  //сила натяжения нити справа
 +
this.N1 = "N1 = ";  //сила давления левого шара на правый
 +
this.N2 = "N2 = ";  //сила давления правого шара на левый
 +
            }
 +
 +
            var gui = new dat.GUI() //функция управления ползунками (изменение параметров)
 +
gui.add(controls, 'Radius1', 1, 2, 0.05).onChange(RePict);
 +
            gui.add(controls, 'Coefficient', 0.125, 2, 0.25).onChange(RePict);
 +
            gui.add(controls, 'Weight1', 20, 70, 10).onChange(RePict);
 +
gui.add(controls, 'Weight2', 10, 30, 5).onChange(RePict);
 +
            gui.add(controls, 'Length2').listen();  //следующие параметры не изменяются пользователем, а отображают необходимые значения параметров, которые известны или должны быть найдены
 +
gui.add(controls, 'Alfa').listen();
 +
gui.add(controls, 'Tetta').listen();
 +
gui.add(controls, 'T1').listen();
 +
            gui.add(controls, 'T2').listen();
 +
gui.add(controls, 'N1').listen();
 +
gui.add(controls, 'N2').listen();
 +
 +
            control = new THREE.OrbitControls(camera, renderer.domElement); //функция управления
 +
            stats = initStats();
 +
Pict();
 +
            renderScene();
 +
}
 +
 +
function RePict(){ //функция перерисовки конструкции при изменении параметров
 +
 +
        scene.remove(box);
 +
scene.remove(sphere1);
 +
scene.remove(sphere2);
 +
scene.remove(line1);
 +
scene.remove(line2);
 +
scene.remove(arrow1);
 +
scene.remove(arrow2);
 +
scene.remove(arrow3);
 +
scene.remove(arrow4);
 +
scene.remove(arrow5);
 +
scene.remove(arrow6);
 +
            Pict();
 +
renderScene();
 +
}
 +
 +
function Pict(){ //функция рисования
 +
 +
    //расчет данных, которые требуется найти в задачe и угла альфа, который используется при решении
 +
chisl = controls.Radius1*controls.Radius1 + controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+32-(controls.Radius1+controls.Coefficient*controls.Radius2)*(controls.Radius1+controls.Coefficient*controls.Radius2);
 +
znam = 2*Math.sqrt(controls.Radius1*controls.Radius1+16)*Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16);
 +
Alfa = Math.acos(chisl/znam);
 +
    Tetta = Math.atan(-(this.Weight2 + this.Weight1 * Math.cos(this.Alfa)) / (this.Weight1 * Math.sin(this.Alfa))); //угол тетта
 +
                T1 = this.Weight1 * (Math.sin(this.Tetta - 0.5 * this.Alfa) / Math.cos(0.5 * this.Alfa)); ///сила натяжения нити 1
 +
    T2 = this.Weight2 * (Math.sin(this.Tetta - 0.5 * this.Alfa) / Math.cos(0.5 * this.Alfa)); //сила натяжения нити 2
 +
    N1 = (this.Weight1 * Math.abs(Math.cos(this.Tetta))) / Math.cos(0.5 * this.Alfa); //сила действия левого шара на правый
 +
N2 = (this.Weight2 * Math.abs(Math.cos(this.Tetta))) / Math.cos(0.5 * this.Alfa); //сила действия правого шара на левый
 +
 +
var axes = new THREE.AxisHelper(4); //оси координат
 +
                scene.add(axes);
 +
axes.position.y=4;
 +
 +
box = new THREE.BoxGeometry(9, 0.5, 15); //создаем плоскость, к которой будет крепиться конструкция
 +
                boxM = new THREE.MeshBasicMaterial({
 +
                    opacity: 0.9,
 +
                    color: 0x9475736,
 +
                    transparent: true
 +
                });
 +
box = new THREE.Mesh(box, boxM);
 +
box.position.y=4;
 +
                scene.add(box);
 +
 +
var sphereG1 = new THREE.SphereGeometry(controls.Radius1, 50, 50); //создаем шар слева
 +
var mat_s2 = new THREE.MeshBasicMaterial({
 +
                    opacity: 0.5,
 +
                    color: 0x764367,
 +
                    transparent: true
 +
                });
 +
                sphere1 = new THREE.Mesh(sphereG1, mat_s2);
 +
                sphere1.castShadow = true;
 +
                scene.add(sphere1);
 +
                sphere1.position.z = controls.Radius1;
 +
 +
var sphereG = new THREE.SphereGeometry(controls.Coefficient*controls.Radius2, 100, 100); //создаем шар справа
 +
var mat_s1 = new THREE.MeshBasicMaterial({
 +
                    opacity: 0.7,
 +
                    color: 0x0656ff,
 +
                    transparent: true
 +
                });
 +
                sphere2 = new THREE.Mesh(sphereG, mat_s1);
 +
                sphere2.castShadow = true;
 +
                scene.add(sphere2);
 +
                sphere2.position.z = -controls.Coefficient*controls.Radius2;
 +
 +
var lineGeometry = new THREE.Geometry(); //Нить справа
 +
                lineGeometry.vertices.push(new THREE.Vector3(0, 0, 0)); //Указываем вектор первой точки
 +
                lineGeometry.vertices.push(new THREE.Vector3(0, -4, sphere1.position.z)); //Указываем вектор второй точки
 +
                var lineMaterial = new THREE.LineBasicMaterial({
 +
                    color: 0x00ffff,
 +
                    linewidth: 500
 +
                });
 +
                line1 = new THREE.Line(lineGeometry, lineMaterial); //Создаем линию из созданной геометрии
 +
line1.position.y=4;
 +
                scene.add(line1);
 +
 +
var lineGeometry = new THREE.Geometry(); //Нить слева
 +
                lineGeometry.vertices.push(new THREE.Vector3(0, 0, 0)); //Указываем вектор первой точки
 +
                lineGeometry.vertices.push(new THREE.Vector3(0, -4, sphere2.position.z)); //Указываем вектор второй точки
 +
                var lineMaterial1 = new THREE.LineBasicMaterial({
 +
                    color: 0xf4ff00,
 +
                    linewidth: 500
 +
                });
 +
                line2 = new THREE.Line(lineGeometry, lineMaterial1); //Создаем линию из созданной геометрии
 +
line2.position.y=4;
 +
                scene.add(line2);
 +
 +
//слева
 +
arrow1 = new THREE.ArrowHelper(new THREE.Vector3(0, -1, 0), new THREE.Vector3(0, 0, sphere1.position.z), controls.Weight1/20, 0x4500ff, 0.5, 0.5);
 +
scene.add(arrow1); //стрелка вниз, обозначает вес шара слева
 +
arrow2 = new THREE.ArrowHelper(new THREE.Vector3(0, 0, -1), new THREE.Vector3(0, 0, sphere1.position.z - controls.Radius1), controls.N1/5, 0xff0000, 0.5, 0.5);
 +
scene.add(arrow2); //стрелка вправо, обозначает силу давления левого шара на правый
 +
//справа
 +
arrow3 = new THREE.ArrowHelper(new THREE.Vector3(0, 0, 1), new THREE.Vector3(0, 0, sphere2.position.z + controls.Coefficient*controls.Radius2), controls.N2/5, 0x00ff00, 0.5, 0.5);
 +
scene.add(arrow3);//стрелка влево, обозначает силу давления правого шара на левый
 +
arrow4 = new THREE.ArrowHelper(new THREE.Vector3(0, -1, 0), new THREE.Vector3(0, 0, sphere2.position.z), controls.Weight2/10, 0x756238, 0.5, 0.5);
 +
scene.add(arrow4); //стрелка вниз, обозначает вес шара справа
 +
 +
arrow5 = new THREE.ArrowHelper(new THREE.Vector3 (0, 1, 0), new THREE.Vector3(0, 0, sphere1.position.z), controls.T1/20, 0x987823, 0.35, 0.35);
 +
arrow5.rotation.x= -Math.PI/2 + Math.acos(controls.Radius1/Math.sqrt(controls.Radius1*controls.Radius1+16))
 +
arrow5.position.y = controls.Radius1*Math.sin(Math.acos(controls.Radius1/Math.sqrt(controls.Radius1*controls.Radius1+16)))
 +
arrow5.position.z = sphere1.position.z - controls.Radius1*Math.cos(Math.acos(controls.Radius1/Math.sqrt(controls.Radius1*controls.Radius1+16)));
 +
scene.add(arrow5);
 +
 +
arrow6 = new THREE.ArrowHelper(new THREE.Vector3 (0, 1, 0), new THREE.Vector3(0, 0, sphere2.position.z), controls.T2/20, 0x573929, 0.35, 0.35);
 +
arrow6.rotation.x= Math.PI/2 - Math.acos((controls.Coefficient*controls.Radius2)/Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16))
 +
arrow6.position.y = controls.Coefficient*controls.Radius2*Math.sin(Math.acos((controls.Coefficient*controls.Radius2)/Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16)));
 +
arrow6.position.z = sphere2.position.z + controls.Coefficient*controls.Radius2*Math.cos(Math.acos((controls.Coefficient*controls.Radius2)/Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16)));
 +
scene.add(arrow6);
 +
 +
                camera.position.x = 90; //точка обзора камеры
 +
                camera.position.y = 20;
 +
                camera.position.z = 20;
 +
                camera.lookAt(scene.position); //направление камеры
 +
                document.getElementById("WebGL").appendChild(renderer.domElement);
 +
}     
 +
 +
            function renderScene() //анимация, при изменении параметров передает вычисленные значения на панель с соответствующими обозначениями
 +
            {
 +
    chisl = controls.Radius1*controls.Radius1 + controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+32-(controls.Radius1+controls.Coefficient*controls.Radius2)*(controls.Radius1+controls.Coefficient*controls.Radius2);
 +
znam = 2*Math.sqrt(controls.Radius1*controls.Radius1+16)*Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16);
 +
controls.Length1 = Math.sqrt(controls.Radius1*controls.Radius1+16); //длина нити слева
 +
controls.Length2 = Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16); //длина нити справа
 +
controls.Alfa = Math.acos(chisl/znam);
 +
    controls.Tetta = Math.atan((controls.Weight2 + controls.Weight1 * Math.cos(controls.Alfa)) / (controls.Weight1 * Math.sin(controls.Alfa))); //угол тетта
 +
                controls.T1 = controls.Weight1 * (Math.sin(controls.Tetta - 0.5 * controls.Alfa) / Math.cos(0.5 * controls.Alfa)); ///сила натяжения нити 1
 +
controls.T2 = controls.Weight2 * (Math.sin(controls.Tetta - 0.5 * controls.Alfa) / Math.cos(0.5 * controls.Alfa)); //сила натяжения нити 2
 +
controls.N1 = (controls.Weight1 * Math.abs(Math.cos(controls.Tetta))) / Math.cos(0.5 * controls.Alfa); //сила действия первого шара на второй
 +
controls.N2 = (controls.Weight2 * Math.abs(Math.cos(controls.Tetta))) / Math.cos(0.5 * controls.Alfa); //сила действия второго шара на первый
 +
    stats.update(); //обновление
 +
                requestAnimationFrame(renderScene); //вызов анимации
 +
                renderer.render(scene,camera);
 +
           
 +
}
 +
 +
            function initStats()
 +
            {
 +
                stats = new Stats();
 +
                renderer.shadowMap.enabled = true;
 +
                return stats;
 +
  }
 +
 +
            function onResize() //функция управления "камерой"
 +
            {
 +
                camera.aspect = window.innerWidth / window.innerHeight;
 +
                camera.updateProjectionMatrix();
 +
                renderer.setSize(window.innerWidth, window.innerHeight);
 +
            }
 +
 +
window.onload = init;
 +
            window.addEventListener('resize', onResize, false);
 +
        </script>
 +
</head>
 +
</body>

Версия 03:35, 2 июня 2017

Мещерский. Задача 4.57

Визуализация 3D-задачи по статике на JavaScript

Исполнитель: Тимошенко Валентина

Группа 23604/1 Кафедра Теоретической механики

Формулировка задачи

Два гладких однородных шара С1 и С2, радиусы которых R1 и R2, а веса P1 и P2, подвешены на веревках AB и AD в точке A; AB = l1; AD = l2; l1 + R1= l2 + R2; угол BAD = α. Определить угол θ, образуемый веревкой AD с горизонтальной плоскостью AE, натяжения веревок T1, T2 и силу давления одного шара на другой.


Решение задачи


<syntaxhighlight lang="javascript" line start="1" enclose="div">

<!DOCTYPE html>

<head> <script src = "http://tm.spbstu.ru/htmlets/Timoshenko/Mesherskyi/three.js"> </script> <script src = "http://tm.spbstu.ru/htmlets/Timoshenko/Mesherskyi/stats.min.js"> </script> <script src = "http://tm.spbstu.ru/htmlets/Timoshenko/Mesherskyi/OrbitControls.js" > </script> <script src = "http://tm.spbstu.ru/htmlets/Timoshenko/Mesherskyi/dat.gui.js"> </script> 

   <style>
       body {
           margin: 0;
           overflow: hidden;
       }
   </style>

   <body>

       <script>
           var renderer, camera, scene, stats, controls;

           function init(){
           scene = new THREE.Scene(); //сцена
           camera = new THREE.PerspectiveCamera(10, window.innerWidth / window.innerHeight, 0.1, 1000); //камера
           renderer = new THREE.WebGLRenderer();
           renderer.setClearColor(0xEEEEEE, 1.0); //цвет
           renderer.setSize(window.innerWidth, window.innerHeight); //задаем размеры рендерера
           renderer.shadowMap.enabled = true;

controls = new function() { //функция контроля параметров this.Weight1 = 20; //вес шара слева 

           this.Weight2 = 10; //вес шара справа 
           this.Alfa = 0.02;  //угол между нитями

this.Radius1=1; //радиус шара слева this.Coefficient=1.5; //коэффициент связи радиусов шаров this.Radius2=this.Radius1; //радиус шара справа this.Length1= "Length1 ="; //длина нити слева this.Length2= "Length2 ="; // длина нити справа this.Alfa= "Alfa ="; //угол между нитями this.Tetta = "Tetta ="; //угол между нитью и плоскостью 

           this.T1 = "T1 = ";  //сила нятажения нити слева

this.T2 = "T2 = "; //сила натяжения нити справа this.N1 = "N1 = "; //сила давления левого шара на правый this.N2 = "N2 = "; //сила давления правого шара на левый 

           }

           var gui = new dat.GUI() //функция управления ползунками (изменение параметров)

gui.add(controls, 'Radius1', 1, 2, 0.05).onChange(RePict); 

           gui.add(controls, 'Coefficient', 0.125, 2, 0.25).onChange(RePict);		
           gui.add(controls, 'Weight1', 20, 70, 10).onChange(RePict);

gui.add(controls, 'Weight2', 10, 30, 5).onChange(RePict); 

           gui.add(controls, 'Length2').listen();  //следующие параметры не изменяются пользователем, а отображают необходимые значения параметров, которые известны или должны быть найдены

gui.add(controls, 'Alfa').listen(); gui.add(controls, 'Tetta').listen(); gui.add(controls, 'T1').listen(); 

           gui.add(controls, 'T2').listen();

gui.add(controls, 'N1').listen(); gui.add(controls, 'N2').listen(); 

           control = new THREE.OrbitControls(camera, renderer.domElement); //функция управления 
           stats = initStats();

Pict(); 

           renderScene();

}

function RePict(){ //функция перерисовки конструкции при изменении параметров

scene.remove(box); scene.remove(sphere1); scene.remove(sphere2); scene.remove(line1); scene.remove(line2); scene.remove(arrow1); scene.remove(arrow2); scene.remove(arrow3); scene.remove(arrow4); scene.remove(arrow5); scene.remove(arrow6); 

           Pict();

renderScene(); }

function Pict(){ //функция рисования

//расчет данных, которые требуется найти в задачe и угла альфа, который используется при решении chisl = controls.Radius1*controls.Radius1 + controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+32-(controls.Radius1+controls.Coefficient*controls.Radius2)*(controls.Radius1+controls.Coefficient*controls.Radius2); znam = 2*Math.sqrt(controls.Radius1*controls.Radius1+16)*Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16); Alfa = Math.acos(chisl/znam); Tetta = Math.atan(-(this.Weight2 + this.Weight1 * Math.cos(this.Alfa)) / (this.Weight1 * Math.sin(this.Alfa))); //угол тетта 

               T1 = this.Weight1 * (Math.sin(this.Tetta - 0.5 * this.Alfa) / Math.cos(0.5 * this.Alfa)); ///сила натяжения нити 1

T2 = this.Weight2 * (Math.sin(this.Tetta - 0.5 * this.Alfa) / Math.cos(0.5 * this.Alfa)); //сила натяжения нити 2 N1 = (this.Weight1 * Math.abs(Math.cos(this.Tetta))) / Math.cos(0.5 * this.Alfa); //сила действия левого шара на правый N2 = (this.Weight2 * Math.abs(Math.cos(this.Tetta))) / Math.cos(0.5 * this.Alfa); //сила действия правого шара на левый

var axes = new THREE.AxisHelper(4); //оси координат 

               scene.add(axes);

axes.position.y=4;

box = new THREE.BoxGeometry(9, 0.5, 15); //создаем плоскость, к которой будет крепиться конструкция 

               boxM = new THREE.MeshBasicMaterial({
                   opacity: 0.9,
                   color: 0x9475736,
                   transparent: true
               });

box = new THREE.Mesh(box, boxM); box.position.y=4; 

               scene.add(box);

var sphereG1 = new THREE.SphereGeometry(controls.Radius1, 50, 50); //создаем шар слева var mat_s2 = new THREE.MeshBasicMaterial({ 

                   opacity: 0.5,
                   color: 0x764367,
                   transparent: true
               });
               sphere1 = new THREE.Mesh(sphereG1, mat_s2);
               sphere1.castShadow = true;
               scene.add(sphere1);
               sphere1.position.z = controls.Radius1;

var sphereG = new THREE.SphereGeometry(controls.Coefficient*controls.Radius2, 100, 100); //создаем шар справа var mat_s1 = new THREE.MeshBasicMaterial({ 

                   opacity: 0.7,
                   color: 0x0656ff,
                   transparent: true
               });
               sphere2 = new THREE.Mesh(sphereG, mat_s1);
               sphere2.castShadow = true;
               scene.add(sphere2);
               sphere2.position.z = -controls.Coefficient*controls.Radius2;

var lineGeometry = new THREE.Geometry(); //Нить справа 

               lineGeometry.vertices.push(new THREE.Vector3(0, 0, 0)); //Указываем вектор первой точки
               lineGeometry.vertices.push(new THREE.Vector3(0, -4, sphere1.position.z)); //Указываем вектор второй точки
               var lineMaterial = new THREE.LineBasicMaterial({
                   color: 0x00ffff,
                   linewidth: 500
               });
               line1 = new THREE.Line(lineGeometry, lineMaterial); //Создаем линию из созданной геометрии

line1.position.y=4; 

               scene.add(line1);

var lineGeometry = new THREE.Geometry(); //Нить слева 

               lineGeometry.vertices.push(new THREE.Vector3(0, 0, 0)); //Указываем вектор первой точки
               lineGeometry.vertices.push(new THREE.Vector3(0, -4, sphere2.position.z)); //Указываем вектор второй точки
               var lineMaterial1 = new THREE.LineBasicMaterial({
                   color: 0xf4ff00,
                   linewidth: 500
               });
               line2 = new THREE.Line(lineGeometry, lineMaterial1); //Создаем линию из созданной геометрии

line2.position.y=4; 

               scene.add(line2);

//слева arrow1 = new THREE.ArrowHelper(new THREE.Vector3(0, -1, 0), new THREE.Vector3(0, 0, sphere1.position.z), controls.Weight1/20, 0x4500ff, 0.5, 0.5); scene.add(arrow1); //стрелка вниз, обозначает вес шара слева arrow2 = new THREE.ArrowHelper(new THREE.Vector3(0, 0, -1), new THREE.Vector3(0, 0, sphere1.position.z - controls.Radius1), controls.N1/5, 0xff0000, 0.5, 0.5); scene.add(arrow2); //стрелка вправо, обозначает силу давления левого шара на правый //справа arrow3 = new THREE.ArrowHelper(new THREE.Vector3(0, 0, 1), new THREE.Vector3(0, 0, sphere2.position.z + controls.Coefficient*controls.Radius2), controls.N2/5, 0x00ff00, 0.5, 0.5); scene.add(arrow3);//стрелка влево, обозначает силу давления правого шара на левый arrow4 = new THREE.ArrowHelper(new THREE.Vector3(0, -1, 0), new THREE.Vector3(0, 0, sphere2.position.z), controls.Weight2/10, 0x756238, 0.5, 0.5); scene.add(arrow4); //стрелка вниз, обозначает вес шара справа

arrow5 = new THREE.ArrowHelper(new THREE.Vector3 (0, 1, 0), new THREE.Vector3(0, 0, sphere1.position.z), controls.T1/20, 0x987823, 0.35, 0.35); arrow5.rotation.x= -Math.PI/2 + Math.acos(controls.Radius1/Math.sqrt(controls.Radius1*controls.Radius1+16)) arrow5.position.y = controls.Radius1*Math.sin(Math.acos(controls.Radius1/Math.sqrt(controls.Radius1*controls.Radius1+16))) arrow5.position.z = sphere1.position.z - controls.Radius1*Math.cos(Math.acos(controls.Radius1/Math.sqrt(controls.Radius1*controls.Radius1+16))); scene.add(arrow5);

arrow6 = new THREE.ArrowHelper(new THREE.Vector3 (0, 1, 0), new THREE.Vector3(0, 0, sphere2.position.z), controls.T2/20, 0x573929, 0.35, 0.35); arrow6.rotation.x= Math.PI/2 - Math.acos((controls.Coefficient*controls.Radius2)/Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16)) arrow6.position.y = controls.Coefficient*controls.Radius2*Math.sin(Math.acos((controls.Coefficient*controls.Radius2)/Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16))); arrow6.position.z = sphere2.position.z + controls.Coefficient*controls.Radius2*Math.cos(Math.acos((controls.Coefficient*controls.Radius2)/Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16))); scene.add(arrow6); 

               camera.position.x = 90; //точка обзора камеры
               camera.position.y = 20;
               camera.position.z = 20;
               camera.lookAt(scene.position); //направление камеры
               document.getElementById("WebGL").appendChild(renderer.domElement);

} 

           function renderScene() //анимация, при изменении параметров передает вычисленные значения на панель с соответствующими обозначениями
           {

chisl = controls.Radius1*controls.Radius1 + controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+32-(controls.Radius1+controls.Coefficient*controls.Radius2)*(controls.Radius1+controls.Coefficient*controls.Radius2); znam = 2*Math.sqrt(controls.Radius1*controls.Radius1+16)*Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16); controls.Length1 = Math.sqrt(controls.Radius1*controls.Radius1+16); //длина нити слева controls.Length2 = Math.sqrt(controls.Coefficient*controls.Radius2*controls.Coefficient*controls.Radius2+16); //длина нити справа controls.Alfa = Math.acos(chisl/znam); controls.Tetta = Math.atan((controls.Weight2 + controls.Weight1 * Math.cos(controls.Alfa)) / (controls.Weight1 * Math.sin(controls.Alfa))); //угол тетта 

               controls.T1 = controls.Weight1 * (Math.sin(controls.Tetta - 0.5 * controls.Alfa) / Math.cos(0.5 * controls.Alfa)); ///сила натяжения нити 1

controls.T2 = controls.Weight2 * (Math.sin(controls.Tetta - 0.5 * controls.Alfa) / Math.cos(0.5 * controls.Alfa)); //сила натяжения нити 2 controls.N1 = (controls.Weight1 * Math.abs(Math.cos(controls.Tetta))) / Math.cos(0.5 * controls.Alfa); //сила действия первого шара на второй controls.N2 = (controls.Weight2 * Math.abs(Math.cos(controls.Tetta))) / Math.cos(0.5 * controls.Alfa); //сила действия второго шара на первый stats.update(); //обновление 

               requestAnimationFrame(renderScene); //вызов анимации
               renderer.render(scene,camera);

} 

           function initStats() 
           {
               stats = new Stats();
               renderer.shadowMap.enabled = true;
               return stats;

} 

           function onResize() //функция управления "камерой"
           {
               camera.aspect = window.innerWidth / window.innerHeight;
               camera.updateProjectionMatrix();
               renderer.setSize(window.innerWidth, window.innerHeight);
           }

window.onload = init; 

           window.addEventListener('resize', onResize, false);
       </script>

</head>

</body>
Источник — «http://tm.spbstu.ru/?title=Мещерский._Задача_4.57&oldid=47005»