Мещерский 48.15 — различия между версиями
Строка 6: | Строка 6: | ||
{{#widget:Iframe |url=http://tm.spbstu.ru/htmlets/Trotskaya_VV/trockayavv.html |width=850 |height=400 |border=0 }} | {{#widget:Iframe |url=http://tm.spbstu.ru/htmlets/Trotskaya_VV/trockayavv.html |width=850 |height=400 |border=0 }} | ||
+ | |||
+ | ==Код программы== | ||
+ | <div class="mw-collapsible mw-collapsed"> | ||
+ | '''Текст программы на языке JavaScript:''' | ||
+ | <div id="WebGL-output"> | ||
+ | </div> | ||
+ | <div id="Stats-output"> | ||
+ | </div> | ||
+ | <!--Javascript code that runs our Three.js examples --> | ||
+ | <script type="text/javascript"> | ||
+ | // once everything is loaded, we run our Three.js stuff. | ||
+ | $(function () { | ||
+ | var dt = 1/60; | ||
+ | var g = 9.8; | ||
+ | function ksi(t) { | ||
+ | return 0.125*t*t; | ||
+ | } | ||
+ | function dksi(t) { | ||
+ | return (ksi(t+0.001)-ksi(t))/0.001; | ||
+ | } | ||
+ | function ddksi(t) { | ||
+ | return (dksi(t+0.001)-dksi(t))/0.001; | ||
+ | } | ||
+ | var c = new function() { | ||
+ | this.animate=false; | ||
+ | this.alpha=Math.PI/6; | ||
+ | this.m=1; | ||
+ | this.l=4; | ||
+ | this.t=0; | ||
+ | this.fi = 0; | ||
+ | <!-- this.eps=-g/this.l*Math.sin(this.fi)-2/this.l*Math.cos(this.fi-this.alpha); --> | ||
+ | <!-- this.omega=this.eps*this.t; --> | ||
+ | <!-- this.ksi=0.125*this.t*this.t; --> | ||
+ | this.calculate = function() { | ||
+ | if(this.t>Math.sqrt(40*8)) {this.t=0}; | ||
+ | this.dksi = dksi(this.t); | ||
+ | this.ddksi = ddksi(this.t); | ||
+ | this.ksi=ksi(this.t); | ||
+ | this.eps=-g/this.l*Math.sin(this.fi)-this.ddksi/this.l*Math.cos(this.fi-this.alpha); | ||
+ | this.omega=this.eps*this.t; | ||
+ | this.fi=Math.PI/6*Math.sin(Math.sqrt(g/this.l)*this.t+Math.PI/6);//this.eps*this.t*this.t/2; | ||
+ | } | ||
+ | this.calculate(); | ||
+ | this.setDefault = function() { | ||
+ | this.t = 0; | ||
+ | this.calculate(); | ||
+ | } | ||
+ | } | ||
+ | console.log(c); | ||
+ | var gui = new dat.GUI(); | ||
+ | var animeChange = gui.add(c,'animate'); | ||
+ | var alphaChange = gui.add(c,'alpha',0,Math.PI/3); | ||
+ | gui.add(c,'ksi').listen(); | ||
+ | gui.add(c,'t').listen(); | ||
+ | gui.add(c,'fi').listen(); | ||
+ | gui.add(c,'omega').listen(); | ||
+ | gui.add(c,'eps').listen(); | ||
+ | |||
+ | |||
+ | animeChange.onFinishChange(function(value) { | ||
+ | c.setDefault(); | ||
+ | c.calculate(); | ||
+ | }); | ||
+ | alphaChange.onFinishChange(function(value) { | ||
+ | c.setDefault(); | ||
+ | c.calculate(); | ||
+ | }); | ||
+ | |||
+ | |||
+ | var scene = new THREE.Scene(); | ||
+ | |||
+ | /* | ||
+ | var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight , 0.1, 1000); | ||
+ | camera.position.x = 10; | ||
+ | camera.position.y = 10; | ||
+ | camera.position.z = 50; | ||
+ | */ | ||
+ | //*z | ||
+ | var camera = new THREE.OrthographicCamera( window.innerWidth / - 50, window.innerWidth / 50, window.innerHeight / 50, window.innerHeight / - 50, 1, 100 ); | ||
+ | camera.position.x = 0; | ||
+ | camera.position.y = 0; | ||
+ | camera.position.z = 30; | ||
+ | //*/ | ||
+ | var renderer = new THREE.WebGLRenderer(); | ||
+ | renderer.setClearColor(0xe2f1fd); | ||
+ | renderer.setSize(window.innerWidth, window.innerHeight); | ||
+ | while(scene.children.length > 0){ | ||
+ | scene.remove(scene.children[0]); | ||
+ | } | ||
+ | var axes = new THREE.AxesHelper( 20 ); | ||
+ | scene.add(axes); | ||
+ | |||
+ | control = new THREE.OrbitControls(camera,renderer.domElement); | ||
+ | |||
+ | // ��������� ������ | ||
+ | <!-- function Curve1() { --> | ||
+ | <!-- THREE.Curve.call(this); --> | ||
+ | <!-- }; --> | ||
+ | <!-- Curve1.prototype = Object.create(THREE.Curve.prototype); --> | ||
+ | <!-- Curve1.prototype.constructor = Curve1; --> | ||
+ | <!-- Curve1.prototype.getPoint = function(t) { --> | ||
+ | <!-- var tx = t*c.ksi*Math.cos(c.alpha); --> | ||
+ | <!-- var ty = t*c.ksi*Math.sin(c.alpha); --> | ||
+ | <!-- return new THREE.Vector3(tx,ty,0); --> | ||
+ | <!-- }; --> | ||
+ | <!-- var path1 = new Curve1(); --> | ||
+ | <!-- scene.add(new THREE.Mesh(new THREE.TubeGeometry(path1,15,0.2,3), new THREE.MeshBasicMaterial({color: 0x000000, wireframe: true}))); --> | ||
+ | var h = 40 | ||
+ | var cyl = new THREE.Mesh(new THREE.CylinderGeometry(0.2,0.2,h,32,5,0), new THREE.MeshLambertMaterial({color: 0xEEEEEE, wireframe:false})); | ||
+ | scene.add(cyl); | ||
+ | |||
+ | // ������ | ||
+ | var pod = new THREE.Mesh(new THREE.SphereGeometry(0.4,8,8), new THREE.MeshLambertMaterial({color: 0xff0000, wireframe:false})); | ||
+ | scene.add(pod); | ||
+ | |||
+ | var tab = new THREE.Mesh(new THREE.CylinderGeometry(0.2,0.2,c.l,32,5,0), new THREE.MeshLambertMaterial({color: 0xEEEEEE, wireframe:false})); | ||
+ | tab.rotation.set(0,0,c.fi); | ||
+ | tab.position.set(pod.position.x+c.l/2*Math.sin(c.fi),pod.position.y-c.l/2*Math.cos(c.fi),0); | ||
+ | scene.add(tab); | ||
+ | |||
+ | |||
+ | var w = new THREE.Mesh(new THREE.SphereGeometry(0.8,8,8), new THREE.MeshLambertMaterial({color: 0x00ff00, wireframe:false})); | ||
+ | scene.add(w); | ||
+ | |||
+ | |||
+ | var spotLight = new THREE.SpotLight( 0xffffff ); | ||
+ | spotLight.position.set( 0, 80, 30 ); | ||
+ | spotLight.castShadow = true; | ||
+ | scene.add(spotLight ); | ||
+ | //camera.lookAt(scene.position); | ||
+ | |||
+ | function initStats() | ||
+ | { | ||
+ | var 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; | ||
+ | }; | ||
+ | |||
+ | stats = initStats(); | ||
+ | |||
+ | function renderScene() { | ||
+ | stats.update(); | ||
+ | if(c.animate) {c.t+=dt;} | ||
+ | c.calculate(); | ||
+ | cyl.rotation.set(0,0,-Math.PI/2+c.alpha); | ||
+ | cyl.position.set(h/2*Math.cos(c.alpha),h/2*Math.sin(c.alpha),0); | ||
+ | pod.position.set(c.ksi*Math.cos(c.alpha),c.ksi*Math.sin(c.alpha),0); | ||
+ | tab.rotation.set(0,0,c.fi); | ||
+ | tab.position.set(pod.position.x+c.l/2*Math.sin(c.fi),pod.position.y-c.l/2*Math.cos(c.fi),0); | ||
+ | w.position.set(pod.position.x+c.l*Math.sin(c.fi),pod.position.y-c.l*Math.cos(c.fi),0); | ||
+ | requestAnimationFrame(renderScene); | ||
+ | renderer.render(scene, camera); | ||
+ | } | ||
+ | go = function() { | ||
+ | $("#WebGL-output").append(renderer.domElement); | ||
+ | renderScene(); | ||
+ | }; | ||
+ | go(); | ||
+ | }); | ||
+ | </script> | ||
+ | </div> | ||
Версия 11:35, 22 декабря 2017
Задача: С помощью языка программирования JavaScript смоделировать колебания маятника, точка подвеса которого движется по заданному закону.
Выполнил: Троцкая Валерия, 23632/2
Решение
Код программы
Текст программы на языке JavaScript:
<script type="text/javascript"> // once everything is loaded, we run our Three.js stuff. $(function () { var dt = 1/60; var g = 9.8; function ksi(t) { return 0.125*t*t; } function dksi(t) { return (ksi(t+0.001)-ksi(t))/0.001; } function ddksi(t) { return (dksi(t+0.001)-dksi(t))/0.001; } var c = new function() { this.animate=false; this.alpha=Math.PI/6; this.m=1; this.l=4; this.t=0; this.fi = 0; this.calculate = function() { if(this.t>Math.sqrt(40*8)) {this.t=0}; this.dksi = dksi(this.t); this.ddksi = ddksi(this.t); this.ksi=ksi(this.t); this.eps=-g/this.l*Math.sin(this.fi)-this.ddksi/this.l*Math.cos(this.fi-this.alpha); this.omega=this.eps*this.t; this.fi=Math.PI/6*Math.sin(Math.sqrt(g/this.l)*this.t+Math.PI/6);//this.eps*this.t*this.t/2;
}
this.calculate(); this.setDefault = function() { this.t = 0; this.calculate(); } } console.log(c); var gui = new dat.GUI(); var animeChange = gui.add(c,'animate'); var alphaChange = gui.add(c,'alpha',0,Math.PI/3); gui.add(c,'ksi').listen(); gui.add(c,'t').listen(); gui.add(c,'fi').listen(); gui.add(c,'omega').listen(); gui.add(c,'eps').listen();
animeChange.onFinishChange(function(value) {
c.setDefault();
c.calculate();
});
alphaChange.onFinishChange(function(value) {
c.setDefault();
c.calculate();
});
var scene = new THREE.Scene();
/* var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight , 0.1, 1000); camera.position.x = 10; camera.position.y = 10; camera.position.z = 50; */ //*z var camera = new THREE.OrthographicCamera( window.innerWidth / - 50, window.innerWidth / 50, window.innerHeight / 50, window.innerHeight / - 50, 1, 100 ); camera.position.x = 0; camera.position.y = 0; camera.position.z = 30; //*/ var renderer = new THREE.WebGLRenderer(); renderer.setClearColor(0xe2f1fd); renderer.setSize(window.innerWidth, window.innerHeight); while(scene.children.length > 0){ scene.remove(scene.children[0]); } var axes = new THREE.AxesHelper( 20 ); scene.add(axes);
control = new THREE.OrbitControls(camera,renderer.domElement);
// ��������� ������ var h = 40 var cyl = new THREE.Mesh(new THREE.CylinderGeometry(0.2,0.2,h,32,5,0), new THREE.MeshLambertMaterial({color: 0xEEEEEE, wireframe:false})); scene.add(cyl);
// ������ var pod = new THREE.Mesh(new THREE.SphereGeometry(0.4,8,8), new THREE.MeshLambertMaterial({color: 0xff0000, wireframe:false})); scene.add(pod);
var tab = new THREE.Mesh(new THREE.CylinderGeometry(0.2,0.2,c.l,32,5,0), new THREE.MeshLambertMaterial({color: 0xEEEEEE, wireframe:false})); tab.rotation.set(0,0,c.fi); tab.position.set(pod.position.x+c.l/2*Math.sin(c.fi),pod.position.y-c.l/2*Math.cos(c.fi),0); scene.add(tab);
var w = new THREE.Mesh(new THREE.SphereGeometry(0.8,8,8), new THREE.MeshLambertMaterial({color: 0x00ff00, wireframe:false}));
scene.add(w);
var spotLight = new THREE.SpotLight( 0xffffff );
spotLight.position.set( 0, 80, 30 );
spotLight.castShadow = true;
scene.add(spotLight );
//camera.lookAt(scene.position);
function initStats() { var 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; };
stats = initStats();
function renderScene() { stats.update(); if(c.animate) {c.t+=dt;} c.calculate(); cyl.rotation.set(0,0,-Math.PI/2+c.alpha); cyl.position.set(h/2*Math.cos(c.alpha),h/2*Math.sin(c.alpha),0); pod.position.set(c.ksi*Math.cos(c.alpha),c.ksi*Math.sin(c.alpha),0); tab.rotation.set(0,0,c.fi); tab.position.set(pod.position.x+c.l/2*Math.sin(c.fi),pod.position.y-c.l/2*Math.cos(c.fi),0); w.position.set(pod.position.x+c.l*Math.sin(c.fi),pod.position.y-c.l*Math.cos(c.fi),0); requestAnimationFrame(renderScene); renderer.render(scene, camera); } go = function() { $("#WebGL-output").append(renderer.domElement); renderScene(); }; go(); }); </script>
Возможности программы
- изменение угла наклона прямой
Решение частного случая
Условия задачи:
Точка подвеса маятника, состоящего из материальной точки массы
на нерастяжимой нити длины , движется по заданному закону по наклонной прямой, образующей угол с горизонтом. Составить уравнение движения маятника.Решение:
Кинетическая энергия маятника
, где . Здесь . Тогда квадрат скорости равен и кинетическая энергия равна соответственно Потенциальная энергия будет равнаУравнение Лагранжа для системы с одной степенью свободы имеет вид:
- Вычисляем производные, входящие в это уравнение
Подставим полученные производные в уравнение Лагранжа:
, поделим обе части уравнения на и получим