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

Текущая версия на 12:14, 22 мая 2017

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

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

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

Формулировка задачи[править]

Решение задачи[править]

<!DOCTYPE html> <html> <head> <script src = "http://tm.spbstu.ru/htmlets/Ivanova/Threads/three.js"> </script> <script src = "http://tm.spbstu.ru/htmlets/Ivanova/Threads/stats.min.js"> </script> <script src = "http://tm.spbstu.ru/htmlets/Ivanova/Threads/OrbitControls.js" > </script> <script src = "http://tm.spbstu.ru/htmlets/Ivanova/Threads/dat.gui.js"> </script> <meta charset = "utf-8"> <style>

       body
       {
       margin:0;
       overflow:hidden;
       }

</style>

</head> <body>

var arrowHelper1,arrowHelper2,arrowHelper3,arrowHelper4,arrowHelper5,arrowHelper6,arrowHelper7,arrowHelper8; var renderer,scene,camera,spotLight,stats,controls, control,line1,line2,line3, qq, vvTa, vvTb, vvTc, Q1, d1, L1;

var d; var L; var Q; scene = new THREE.Scene(); camera = new THREE.PerspectiveCamera(60,window.innerWidth/window.innerHeight,0.1,1000); renderer = new THREE.WebGLRenderer();

       renderer.setClearColor(0xEEEEEE, 1.0);
       renderer.setSize(window.innerWidth, window.innerHeight);
       renderer.shadowMapEnabled = true;

function init() { var axes = new THREE.AxisHelper(40); scene.add(axes);

camera.position.x = 40; camera.position.y = 40; camera.position.z = 40;

camera.lookAt(scene.position); document.getElementById("WebGL").appendChild(renderer.domElement);

var spotLight = new THREE.SpotLight( 0xffffff ); spotLight.position.set( -40, 60, -10 ); spotLight.castShadow = true; scene.add( spotLight );

controls1 = new function() { this.weightQ = 20; // вес, приложенный в узле this.lengthd = 25; // расстояние между точкой закрепления нити и началом координат this.lengthL = 15; // длина нити this.Vectors = true;

this.angleA = + 0; // вывод полученных в ходе решения задачи значений this.angleB = + 0; this.angleC = + 0; this.Ta = + 0; this.Tb = + 0; this.Tc = + 0; }

stats = initStats(); controls = new THREE.OrbitControls(camera,renderer.domElement); renderScene();

var gui = new dat.GUI(); var contr = gui.addFolder('Controls');

contr.add(controls1, 'weightQ',0,100); contr.add(controls1, 'lengthd',0,40); contr.add(controls1, 'lengthL',0.816, 40); contr.add(controls1, 'Vectors').onChange(Change);

var res = gui.addFolder('Result'); res.add(controls, 'angleA').listen(); res.add(controls, 'angleB').listen(); res.add(controls, 'angleC').listen(); res.add(controls, 'Ta').listen(); res.add(controls, 'Tb').listen(); res.add(controls, 'Tc').listen();

}

function renderScene() { stats.update(); requestAnimationFrame(renderScene);

Q1 = controls1.weightQ; d1 = controls1.lengthd; L1 = controls1.lengthL;

controls.Ta = + (d1 - Math.sqrt(3*L1*L1 - 2*d1*d1)) * L1 * Q1 / (3*d1*(Math.sqrt(3*L1*L1 - 2*d1*d1))); // вывод решения на экран controls.Tb = + (d1 - Math.sqrt(3*L1*L1 - 2*d1*d1)) * L1 * Q1 / (3*d1*(Math.sqrt(3*L1*L1 - 2*d1*d1))); controls.Tc = + (d1 - Math.sqrt(3*L1*L1 - 2*d1*d1))*L1*Q1/(3*d1*(Math.sqrt(3*L1*L1 - 2*d1*d1)));

Tlength = controls.Ta TClength = controls.Tc

controls.angleA = + Math.asin((d1 - Math.sqrt(3*d1*d1 - 2*d1*d1))/(3*d1)); controls.angleB = + Math.atan((d1 - Math.sqrt(3*d1*d1 - 2*d1*d1))/(2*d1 + Math.sqrt(3*d1*d1 - 2*d1*d1) )); controls.angleC = + Math.acos((2 * d1 + Math.sqrt(3*d1*d1 - 2*d1*d1))/(3*d1));

Change(); renderer.render(scene,camera); }

function Change() { if (controls1.Vectors == true) Draw(); else Draw1(); }

function ClearScene() { // удаляем ранее созданные объекты scene.remove(line1); scene.remove(line2); scene.remove(line3); scene.remove(qq); scene.remove(vvTa); scene.remove(vvTc); scene.remove(vvTb); }

function ReDrawN()// рисуем нити { var ty = (1/3)*(d1 - ((3*L1)^2 - (2*d1)^2)^(1/2));

var lineGeometry = new THREE.Geometry();//Производная фигура lineGeometry.vertices.push(new THREE.Vector3( d1,0, 0));//Указываем вектор первой точки lineGeometry.vertices.push(new THREE.Vector3( ty,ty, ty));//Указываем вектор второй точки var lineMaterial = new THREE.LineBasicMaterial({color:0x00FF00, linewidth:500}); line1 = new THREE.Line(lineGeometry, lineMaterial);//Создаем линию из созданной геометрии scene.add(line1);//Добавляем объект на сцену

var lineGeometry = new THREE.Geometry();//Производная фигур lineGeometry.vertices.push(new THREE.Vector3( 0, d1,0));//Указываем вектор первой точки lineGeometry.vertices.push(new THREE.Vector3( ty,ty, ty));//Указываем вектор второй точки var lineMaterial = new THREE.LineBasicMaterial({color:0x00FF00, linewidth:500}); line2 = new THREE.Line(lineGeometry, lineMaterial);//Создаем линию из созданной геометрии scene.add(line2);//Добавляем объект на сцену

var lineGeometry = new THREE.Geometry();//Производная фигура lineGeometry.vertices.push(new THREE.Vector3( 0,0, d1));//Указываем вектор первой точки lineGeometry.vertices.push(new THREE.Vector3( ty,ty, ty));//Указываем вектор второй точки var lineMaterial = new THREE.LineBasicMaterial({color:0x00FF00, linewidth:500}); line3 = new THREE.Line(lineGeometry, lineMaterial);//Создаем линию из созданной геометрии scene.add(line3);//Добавляем объект на сцену }

function ReDrawV()//вектора { var ty = (1/3)*(d1 - ((3*L1)^2 - (2*d1)^2)^(1/2));

var vQ = new THREE.Vector3 (0, -1, 0); // создаем геометрию вектора, отображающего вес, приложенный к пересечению нитей var origin = new THREE.Vector3(ty,ty,ty); // задаем точку начала для векторов Q и Tc qq = new THREE.ArrowHelper( vQ, origin, Q1, 0xDC143C ); // создаем срелочку scene.add( qq ); // заносим на сцену

var vTa = new THREE.Vector3(ty, ty, ty); // создаем геометрию вектора, отображающего натяжение нити А var originA = new THREE.Vector3(d1,0,0); vvTa = new THREE.ArrowHelper( vTa, origin, this.Tlength , 0x8B0000); // создаем стрелочку scene.add( vvTa ); // заносим на сцену

var vTb = new THREE.Vector3( ty, ty, ty); // создаем геометрию вектора, отображающего натяжение нити В var originB = new THREE.Vector3(0,d1,0); vvTb = new THREE.ArrowHelper( vTb, originB, this.Tlength, 0x8B0000); // создаем стрелочку scene.add( vvTb ); // заносим на сцену

var vTc = new THREE.Vector3(-1, -1, 1 ); // создаем геометрию вектора, отображающего натяжение нити C var origin = new THREE.Vector3(ty,ty,ty); vvTc = new THREE.ArrowHelper( vTc, origin, this.TClength, 0x8B0000); // создаем стрелочку scene.add(vvTc ); // заносим на сцену }

function Draw1() { ClearScene(); ReDrawN(); }

function Draw() { ClearScene(); ReDrawV(); ReDrawN(); }

function initStats() //window in the left corner { stats = new Stats(); stats.setMode(0); stats.domElement.style.position = '0px'; stats.domElement.style.left = '0px'; stats.domElement.style.top = '0px'; document.getElementById("Stats-output").appendChild(stats.domElement); return stats; }

function onResize() //moving of camera {

   camera.aspect = window.innerWidth/window.innerHeight;
   camera.updateProjectionMatrix();
   renderer.setSize(window.innerWidth,window.innerHeight);

}

window.onload = init;

</script>

</body>

</html>

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

Текущая версия на 12:14, 22 мая 2017

Формулировка задачи[править]

Решение задачи[править]

Навигация

Персональные инструменты

Пространства имён

Варианты

Просмотры

Ещё

Поиск

Навигация

Инструменты

Поделиться

@@ Строка 11: / Строка 11: @@
 [[File:Ris.png]]
 ==Решение задачи==
-{{#widget:Iframe |url=http://tm.spbstu.ru/htmlets/Ivanova/Threads/change.html |width=1000 |height=830 |border=0 }}
+{{#widget:Iframe |url=http://tm.spbstu.ru/htmlets/Ivanova/Threads/Novy.html |width=1000 |height=830 |border=0 }}
@@ Строка 20: / Строка 21: @@
 <!DOCTYPE html>
+<html>
 <head>
-<meta charset = "utf-8">
-<title> Задача из Мещерского </title>
 <script src = "http://tm.spbstu.ru/htmlets/Ivanova/Threads/three.js">
 </script>
 <script src = "http://tm.spbstu.ru/htmlets/Ivanova/Threads/stats.min.js">
 </script>
-<script src = "http://tm.spbstu.ru/htmlets/Ivanova/Threads/OrbitControls.js">
+<script src = "http://tm.spbstu.ru/htmlets/Ivanova/Threads/OrbitControls.js" >
 </script>
 <script src = "http://tm.spbstu.ru/htmlets/Ivanova/Threads/dat.gui.js">
 </script>
+<meta charset = "utf-8">
 <style>
-  body
+        body
-  {
+        {
-  margin:0;
+        margin:0;
-  overflow:hidden;
+        overflow:hidden;
-  }
+        }
 </style>
 </head>
 <body>
 <div id = "WebGL"> </div>
 <div id = "Stats-output"> </div>
 <script>
+var arrowHelper1,arrowHelper2,arrowHelper3,arrowHelper4,arrowHelper5,arrowHelper6,arrowHelper7,arrowHelper8;
+var renderer,scene,camera,spotLight,stats,controls, control,line1,line2,line3, qq, vvTa, vvTb, vvTc, Q1, d1, L1;
-var renderer,scene,camera,plane,stats,A,B,Y,controls,line1,line2,line3;
+var d;
-/////    ЗАДАНИЕ ПАРАМЕТРОВ, УКАЗАННЫХ В ЗАДАЧЕ    /////
-var l;
 var L;
 var Q;
+scene = new THREE.Scene();
+camera = new THREE.PerspectiveCamera(60,window.innerWidth/window.innerHeight,0.1,1000);
+renderer = new THREE.WebGLRenderer();
+        renderer.setClearColor(0xEEEEEE, 1.0);
+        renderer.setSize(window.innerWidth, window.innerHeight);
+        renderer.shadowMapEnabled = true;
 function init()
 {
-scene = new THREE.Scene();    // создаем сцену
+	var axes = new THREE.AxisHelper(40);
-camera = new THREE.PerspectiveCamera(45,window.innerWidth/window.innerHeight,0.1,1000);    // создаем камеру
+	scene.add(axes);
-renderer = new THREE.WebGLRenderer();
+	camera.position.x = 40;
-        renderer.setClearColor(0xEEEEEE, 1);
+	camera.position.y = 40;
-        renderer.setSize(window.innerWidth, window.innerHeight);
+	camera.position.z = 40;
-        renderer.shadowMap.enabled = true;
+	camera.lookAt(scene.position);
+	document.getElementById("WebGL").appendChild(renderer.domElement);
-var axes = new THREE.AxisHelper(20);    // создаем координатные оси
-scene.add(axes);
+	var spotLight = new THREE.SpotLight( 0xffffff );
+		spotLight.position.set( -40, 60, -10 );
+		spotLight.castShadow = true;
+		scene.add( spotLight );
+controls1 = new function()
+{
+	this.weightQ = 20;    // вес, приложенный в узле
+	this.lengthd = 25;    // расстояние между точкой закрепления нити и началом координат
+	this.lengthL = 15;    // длина нити
+	this.Vectors = true;
-control = new THREE.OrbitControls(camera,renderer.domElement);
+	this.angleA = '' + 0;    // вывод полученных в ходе решения задачи значений
+	this.angleB =  '' + 0;
-controls = new function()     // создаем переключатели, позволяющие изменять входные параметры
+	this.angleC =  '' + 0;
-{
+	this.Ta =  '' + 0;
-this.weightQ = 3;    // вес, приложенный в узле
+	this.Tb =  '' + 0;
-this.lengthl = 10;    // расстояние между точкой закрепления нити и началом координат
+	this.Tc =  '' + 0;
-this.lengthL = 9;    // длина нити
-this.displayForces = true;    // модуль отображения задачи
-this.angleA = "angle A = ";    // вывод полученных в ходе решения задачи значений
-this.angleB = "angle B = ";
-this.angleY = "angle C = ";
-this.Ta = "Ta = ";
-this.Tb = "Tb = ";
-this.Tc = "Tc = ";
 }
-var gui = new dat.GUI();    // позволяем менять каждый из параметров в определенном диапазоне, в случае изменения вызываем функцию, перестраивающую выводимую на экран картинку
-gui.add(controls, 'weightQ',0,100).onChange(ReDraw);
-gui.add(controls, 'lengthl',0,10).onChange(ReDraw);
-gui.add(controls, 'lengthL',0.816*l, l).onChange(ReDraw);
 stats = initStats();
-Draw();
+controls = new THREE.OrbitControls(camera,renderer.domElement);
 renderScene();
-}
+var gui = new dat.GUI();
+var contr = gui.addFolder('Controls');
+contr.add(controls1, 'weightQ',0,100);
+contr.add(controls1, 'lengthd',0,40);
+contr.add(controls1, 'lengthL',0.816, 40);
+contr.add(controls1, 'Vectors').onChange(Change);
-function VisionTrue()    // функция, рисующая задачу с отображением сил
-{
-ReDraw();
-}
-function ReDraw()    // функция, перерисовывающая всю картинку
+var res = gui.addFolder('Result');
-{
+res.add(controls, 'angleA').listen();
-scene.remove(axes); // удаляем ранее созданные объекты
+res.add(controls, 'angleB').listen();
-scene.remove(line1);
+res.add(controls, 'angleC').listen();
-scene.remove(line2);
+res.add(controls, 'Ta').listen();
-scene.remove(line3);
+res.add(controls, 'Tb').listen();
-scene.remove(Ta);
+res.add(controls, 'Tc').listen();
-scene.remove(Tb);
-scene.remove(Tc);
-Q1 = controls.weightQ;    // меняем значения параметров на те, что ввел пользователь
-l1 = controls.lengthl;
-L1 = controls.lengthL;
-Draw();
 }
-function Draw()
+function renderScene()
 {
-A = Math.asin((l1 - Math.sqrt(3*l1*l1 - 2*l1*l1))/(3*l1));
+	stats.update();
-B = Math.atan((l1 - Math.sqrt(3*l1*l1 - 2*l1*l1))/(2*l1 + Math.sqrt(3*l1*l1 - 2*l1*l1) ));
+	requestAnimationFrame(renderScene);
-C = Math.acos((2*l1 + Math.sqrt(3*l1*l1 - 2*l1*l1))/(3*l1));
-controls.angle = "angleA = " + A;
-controls.angle = "angleB = " + B;
-controls.angle = "angleC = " + C;
+	Q1 = controls1.weightQ;
+	d1 = controls1.lengthd;
+	L1 = controls1.lengthL;
-/////    СОЗДАНИЕ НИТЕЙ    /////
+	controls.Ta = '' + (d1 - Math.sqrt(3*L1*L1 - 2*d1*d1)) * L1 * Q1 / (3*d1*(Math.sqrt(3*L1*L1 - 2*d1*d1)));    // вывод решения на экран
+	controls.Tb = '' + (d1 - Math.sqrt(3*L1*L1 - 2*d1*d1)) * L1 * Q1 / (3*d1*(Math.sqrt(3*L1*L1 - 2*d1*d1)));
+	controls.Tc = '' + (d1 - Math.sqrt(3*L1*L1 - 2*d1*d1))*L1*Q1/(3*d1*(Math.sqrt(3*L1*L1 - 2*d1*d1)));
-var ty = (1/3)*(l1 - ((3*L1)^2 - (2*l1)^2)^(1/2));
+	Tlength =   controls.Ta
-var lg1 = new THREE.Geometry();    // создаем новую геометрию, предназначенную для изображения линии
+	TClength =   controls.Tc
-lg1.vertices.push(
-  new THREE.Vector3(l1,0,0),    // задаем координату начала
+	controls.angleA = '' + Math.asin((d1 - Math.sqrt(3*d1*d1 - 2*d1*d1))/(3*d1));
-  new THREE.Vector3(ty, ty, ty)      // задаем координату конца
+	controls.angleB = '' + Math.atan((d1 - Math.sqrt(3*d1*d1 - 2*d1*d1))/(2*d1 + Math.sqrt(3*d1*d1 - 2*d1*d1) ));
-);
+	controls.angleC = '' + Math.acos((2 * d1 + Math.sqrt(3*d1*d1 - 2*d1*d1))/(3*d1));
-var lm1 = new THREE.LineBasicMaterial({color: 0xA0522D});    // задаем материал
-line1 = new THREE.Line(lg1, lm1);    // задаем линию с указанными координатами и материалом
-scene.add(line1);
-var lg2 = new THREE.Geometry();    // создаем новую геометрию, предназначенную для изображения линии
+	Change();
-lg2.vertices.push(
+	renderer.render(scene,camera);
-  new THREE.Vector3(0, l1, 0),    // задаем координату начала
+}
-  new THREE.Vector3(ty, ty, ty)      // задаем координату конца
-);
+function Change()
-var lm2 = new THREE.LineBasicMaterial({color: 0xA0522D});    // задаем материал
+{
-line2 = new THREE.Line(lg2, lm2);    // задаем линию с указанными координатами и материалом
+	if (controls1.Vectors == true)  Draw();
-scene.add(line2);
+	else Draw1();
+}
+function ClearScene()
+{ // удаляем ранее созданные объекты
+	scene.remove(line1);
+	scene.remove(line2);
+	scene.remove(line3);
+	scene.remove(qq);
+	scene.remove(vvTa);
+	scene.remove(vvTc);
+	scene.remove(vvTb);
+}
+function ReDrawN()// рисуем нити
+{
+	var ty = (1/3)*(d1 - ((3*L1)^2 - (2*d1)^2)^(1/2));
-var lg3 = new THREE.Geometry();    // создаем новую геометрию, предназначенную для изображения линии
+	var lineGeometry = new THREE.Geometry();//Производная фигура
-lg3.vertices.push(
+	lineGeometry.vertices.push(new THREE.Vector3( d1,0, 0));//Указываем вектор первой точки
-  new THREE.Vector3(0, 0, l1),    // задаем координату начала
+	lineGeometry.vertices.push(new THREE.Vector3( ty,ty, ty));//Указываем вектор второй точки
-  new THREE.Vector3(ty, ty, ty)      // задаем координату конца
+	var lineMaterial = new THREE.LineBasicMaterial({color:0x00FF00, linewidth:500});
-);
+	line1 = new THREE.Line(lineGeometry, lineMaterial);//Создаем линию из созданной геометрии
-var lm3 = new THREE.LineBasicMaterial({color: 0xA0522D});    // задаем материал
+	scene.add(line1);//Добавляем объект на сцену
-line3 = new THREE.Line(lg3, lm3);    // задаем линию с указанными координатами и материалом
-scene.add(line3);
-/////    СОЗДАНИЕ ВЕКТОРОВ, ОТОБРАЖАЮЩИХ СИЛЫ, ДЕЙСТВУЮЩИЕ НА ТЕЛА    /////
-var Tlength = (l - Math.sqrt(3*L*L - 2*l*l))*L*Q/(3*l*(Math.sqrt(3*L*L - 2*l*l)));
+	var lineGeometry = new THREE.Geometry();//Производная фигур
-var TClength = (l - Math.sqrt(3*L*L - 2*l*l))*L*Q/(3*l*(Math.sqrt(3*L*L - 2*l*l)));
+	lineGeometry.vertices.push(new THREE.Vector3( 0, d1,0));//Указываем вектор первой точки
+	lineGeometry.vertices.push(new THREE.Vector3( ty,ty, ty));//Указываем вектор второй точки
+	var lineMaterial = new THREE.LineBasicMaterial({color:0x00FF00, linewidth:500});
+	line2 = new THREE.Line(lineGeometry, lineMaterial);//Создаем линию из созданной геометрии
+	scene.add(line2);//Добавляем объект на сцену
+	var lineGeometry = new THREE.Geometry();//Производная фигура
+	lineGeometry.vertices.push(new THREE.Vector3( 0,0, d1));//Указываем вектор первой точки
+	lineGeometry.vertices.push(new THREE.Vector3( ty,ty, ty));//Указываем вектор второй точки
+	var lineMaterial = new THREE.LineBasicMaterial({color:0x00FF00, linewidth:500});
+	line3 = new THREE.Line(lineGeometry, lineMaterial);//Создаем линию из созданной геометрии
+	scene.add(line3);//Добавляем объект на сцену
+}
+function ReDrawV()//вектора
+{
+	var ty = (1/3)*(d1 - ((3*L1)^2 - (2*d1)^2)^(1/2));
-var vQ = new THREE.Vector3 (0, 0, -1);    // создаем геометрию вектора, отображающего вес, приложенный к пересечению нитей
+	var vQ = new THREE.Vector3 (0, -1, 0);    // создаем геометрию вектора, отображающего вес, приложенный к пересечению нитей
-var origin = new THREE.Vector3(ty,ty,ty);    // задаем точку начала для векторов Q и Tc
+	var origin = new THREE.Vector3(ty,ty,ty);    // задаем точку начала для векторов Q и Tc
-var hex = 0xDC143C;    // задаем цвет для веса
+	qq = new THREE.ArrowHelper( vQ, origin, Q1, 0xDC143C );    // создаем срелочку
-qq = new THREE.ArrowHelper( vQ, origin, Q1, hex );    // создаем срелочку
+	scene.add( qq );    // заносим на сцену
-scene.add( qq );    // заносим на сцену
-var vTa = new THREE.Vector3(ty, ty, ty);    // создаем геометрию вектора, отображающего натяжение нити А
+	var vTa = new THREE.Vector3(ty, ty, ty);    // создаем геометрию вектора, отображающего натяжение нити А
-var originA =  new THREE.Vector3(l1,0,0);
+	var originA =  new THREE.Vector3(d1,0,0);
-var hex1 = 0x8B0000;   // цвет, отображающий вектора сил натяжения
+	vvTa = new THREE.ArrowHelper( vTa, origin, this.Tlength , 0x8B0000);    // создаем стрелочку
-vvTa = new THREE.ArrowHelper( vTa, origin, Tlength , hex1);    // создаем стрелочку
+	scene.add( vvTa );    // заносим на сцену
-scene.add( vvTa );    // заносим на сцену
-var vTb = new THREE.Vector3( ty, ty, ty);    // создаем геометрию вектора, отображающего натяжение нити В
+	var vTb = new THREE.Vector3( ty, ty, ty);    // создаем геометрию вектора, отображающего натяжение нити В
-var originB =  new THREE.Vector3(0,l1,0);
+	var originB =  new THREE.Vector3(0,d1,0);
-var hex1 = 0x8B0000;   // цвет, отображающий вектора сил натяжения
+	vvTb = new THREE.ArrowHelper( vTb, originB, this.Tlength, 0x8B0000);    // создаем стрелочку
-vvTb = new THREE.ArrowHelper( vTb, originB, Tlength, hex1);    // создаем стрелочку
+	scene.add( vvTb );    // заносим на сцену
-scene.add( vvTb );    // заносим на сцену
-var vTc = new THREE.Vector3(-1, -1, 1 );    // создаем геометрию вектора, отображающего натяжение нити C
+	var vTc = new THREE.Vector3(-1, -1, 1 );    // создаем геометрию вектора, отображающего натяжение нити C
-var origin = new THREE.Vector3(ty,ty,ty);
+	var origin = new THREE.Vector3(ty,ty,ty);
-var hex1 = 0x8B0000;   // цвет, отображающий вектора сил натяжения
+	vvTc = new THREE.ArrowHelper( vTc, origin, this.TClength, 0x8B0000);    // создаем стрелочку
-vvTc = new THREE.ArrowHelper( vTc, origin, TClength, hex1);    // создаем стрелочку
+	scene.add(vvTc );    // заносим на сцену
-scene.add(vvTc );    // заносим на сцену
+}
-controls.Ta = "Ta = " + Tlength;    // вывод решения на экран
+function Draw1()
-controls.Tb = "Tb = " + Tlength;    // вывод решения на экран
+{
-controls.Tc = "Tc = " + TClength;    // вывод решения на экран
+	ClearScene();
+	ReDrawN();
-camera.position.x = -30;    // задаем местоположение камеры
-camera.position.y = 40;
-camera.position.z = 30;
-camera.lookAt(scene.position);
-document.getElementById("WebGL").appendChild(renderer.domElement);
-renderer.render(scene,camera);
 }
-function renderScene()
+function Draw()
 {
-stats.update();
+	ClearScene();
-Q1 = controls.weightQ;
+	ReDrawV();
-l1 = controls.length1;
+	ReDrawN();
-L1 = controls.lengthL;
-requestAnimationFrame(renderScene);
-renderer.render(scene,camera);
 }
 function initStats() //window in the left corner
 {
-stats  = new Stats();
+	stats  = new Stats();
-stats.setMode(0);
+	stats.setMode(0);
-stats.domElement.style.position = '0px';
+	stats.domElement.style.position = '0px';
-stats.domElement.style.left = '0px';
+	stats.domElement.style.left = '0px';
-stats.domElement.style.top = '0px';
+	stats.domElement.style.top = '0px';
-document.getElementById("Stats-output").appendChild(stats.domElement);
+	document.getElementById("Stats-output").appendChild(stats.domElement);
-return stats;
+	return stats;
 }
 function onResize()  //moving of camera
 {
-  camera.aspect = window.innerWidth/window.innerHeight;
+    camera.aspect = window.innerWidth/window.innerHeight;
-  camera.updateProjectionMatrix();
+    camera.updateProjectionMatrix();
-  renderer.setSize(window.innerWidth,window.innerHeight);
+    renderer.setSize(window.innerWidth,window.innerHeight);
 }
 window.onload = init;
-window.addEventListener('resize',onResize,true);
 </script>
+</body>
+</html>