Траектория тела, брошенного под углом к горизонту — различия между версиями

Материал из Department of Theoretical and Applied Mechanics
Перейти к: навигация, поиск
м (Замена текста — «</source>» на «</syntaxhighligh>»)
 
(не показано 7 промежуточных версий 4 участников)
Строка 31: Строка 31:
  
 
<htmlet nocache="yes">Krivtsov/mg_TM</htmlet>
 
<htmlet nocache="yes">Krivtsov/mg_TM</htmlet>
−
Текст программы построения графиков на языке JavaScript: <toggledisplay status=hide showtext="Показать↓" hidetext="Скрыть↑" linkstyle="font-size:default">  
+
<div class="mw-collapsible mw-collapsed" style="width:100%" >
 +
'''Текст программы построения графиков на языке JavaScript:''' <div class="mw-collapsible-content">
 
Файл '''"mg.js"'''
 
Файл '''"mg.js"'''
 
<syntaxhighlight lang="javascript" line start="1" enclose="div">
 
<syntaxhighlight lang="javascript" line start="1" enclose="div">
Строка 153: Строка 154:
 
     }     
 
     }     
 
}
 
}
−
</syntaxhighligh>
+
</syntaxhighlight>
 
Файл '''"mg.html"'''
 
Файл '''"mg.html"'''
−
<syntaxhighlight lang="html" line start="1" enclose="div">
+
<syntaxhighlight lang="html5" line start="1" enclose="div">
 
<!DOCTYPE html>
 
<!DOCTYPE html>
 
<html>
 
<html>
Строка 164: Строка 165:
 
</head>
 
</head>
 
<body>
 
<body>
−
     <canvas id="canvasGraph" width="400" height="200" style="border:1px solid #000000;"></canvas>
+
     <canvas id="canvasGraph" width="400" height="упцупцупцупorder:1px solid #000000;"></canvas>
  
 
  <!--Выбор графика (чекбоксы)-->
 
  <!--Выбор графика (чекбоксы)-->
Строка 195: Строка 196:
 
</body>
 
</body>
 
</html>  
 
</html>  
−
</syntaxhighligh>
+
</syntaxhighlight>
−
</toggledisplay>
+
</div>
−
 
+
</div>
  
 
== См. также ==
 
== См. также ==

Текущая версия на 11:01, 1 марта 2019

Виртуальная лаборатория > Траектория тела, брошенного под углом к горизонту


Рассмотрим движение материальной точки, брошенной под углом к горизонту в поле силы тяжести. Сопротивление воздуха не учитывается. Уравнение движения рассматриваемой системы и начальные условия имеют вид:

[math] m\ddot{\bf r} = m{\bf g};\qquad \left.\dot{\bf r}\right|_{t=0} = {\bf v}_0,\qquad \left.{\bf r}\right|_{t=0} = 0, [/math]

где [math]m[/math] и [math]{\bf r}[/math] — масса и радиус-вектор материальной точки, [math]m{\bf g}[/math] — сила тяжести, [math]{\bf v}_0[/math] — начальная скорость, [math]t[/math] — время, точкой обозначена производная по времени, векторы выделены жирным шрифтом. Интегрирование уравнения движения по времени с учетом начальных условий дает

[math] {\bf r} = {\bf v}_0\, t + {\bf g}\,\frac{t^2}2. [/math]

Проецируя полученное векторное уравнение на горизонтальную и вертикальную оси [math]x[/math] и [math]y[/math] получим

[math] x = (v_0 \cos\alpha)\,t,\qquad y = (v_0 \sin\alpha)\,t - g\,\frac{t^2}2, [/math]

где [math]\alpha[/math] — угол между направлением начальной скорости и горизонтальным направлением (угол броска). После исключения времени из этих уравнений получим уравнение траектории

[math] y = x\mathop{\rm tg}\alpha - \frac{g}{2v_0^2\cos^2\alpha}\,x^2. [/math]

Таким образом, траектория является параболой, отображенной на интерактивном графике ниже. Сравнивается траектория, соответствующая [math]\alpha = 60^o[/math] и оптимальная траектория, реализующаяся при [math]\alpha = 45^o[/math] и обеспечивающая максимальную дальность броска. Перемещение слайдера позволяет наблюдать влияние угла броска на форму траектории (модуль начальной скорости при этом остается неизменным).


Траектория: — актуальная, — оптимальная (α = 45˚)
Угол броска: α = ˚

Текст программы построения графиков на языке JavaScript:

Файл "mg.js" 

  1 // Движение тела, брошенного под углом к горизонту
  2 // Разработчик А.М. Кривцов 
  3 // 01.06.2014 
  4 // 06.11.2014 коррекция - удаление const (Цветков)
  5 // Интернет: tm.spbstu.ru/mg
  6 
  7 function MainMG(canvas) {
  8 
  9     // Предварительные установки
 10 
 11 	var deg = Math.PI / 180;			// Угловой градус (degree)
 12 
 13 	var X_max = canvas.width;
 14  	var Y_max = canvas.height;
 15 	
 16     // Размерные параметры
 17 
 18     var g = 1.;    // ускорение свободного падения
 19     var v0 = 1.;    // начальная скорость
 20 	
 21     // Расчет констант 
 22 	
 23 	var h = v0 * v0 / 2 / g;
 24 	
 25     // Задание начальных значений параметров
 26 	
 27 	var al = 60 * deg;
 28     
 29 	// Область построения графика
 30     var x_min = 0;  
 31     var x_max = 2 * h;
 32     var y_min = 0;    
 33     var y_max = h;      
 34 
 35  	var N = X_max;                 	// число точек по оси x
 36 	var dx = x_max / N;            	// шаг по оси x
 37 	var sx = X_max / x_max;        	// масштаб по оси x
 38 
 39 	var sy; 							// масштаб по оси y
 40 	var Y0;  							// положение 0 оси y в экранных координатах
 41 	var context;  						// на context происходит рисование
 42 
 43     // настройка слайдеров и текстовых полей
 44 	
 45     Text_01.value = Math.round(al / deg);
 46 	Slider_01.min = 0;       	
 47     Slider_01.max = 90;
 48     Slider_01.step = 1;
 49     Slider_01.value = Text_01.value;     	
 50 	
 51 	draw();
 52 
 53     // функция, запускающаяся при перемещении слайдера
 54     this.set_01 = function(input) { al = input * deg; draw(); }  
 55     
 56 	// Функции, запускающиеся при изменении элементов управления
 57     this.setCheckbox_01 = function(bool) { draw(); }
 58 	this.setCheckbox_02 = function(bool) { draw(); }	
 59 
 60 	// Отображение
 61 	
 62 	function draw() 
 63 	{ 
 64 	   // Расчет параметров графики
 65 		
 66 		sy = Y_max / (y_max - y_min); 			// масштаб по оси y
 67 		Y0 = Y_max + y_min * sy;  				// положение 0 оси y в экранных координатах
 68 
 69 		context = canvas.getContext("2d");  	// на context происходит рисование
 70 		context.clearRect(0, 0, X_max, Y_max); 	// очистить экран
 71         
 72 		// Графики 
 73 
 74 		Graph(F0, 	checkbox_02.checked, 	'lightgrey');		
 75 		Graph(F1, 	checkbox_01.checked, 	'black');
 76 
 77         // Надписи
 78         context.fillStyle = 'black';
 79         context.font = "italic 20px Times";
 80         context.fillText("x", x_max * sx - 15, Y0 - 7);
 81         context.fillText("y", 5, 15);
 82         context.fillText("0", 10, Y0 - 3);
 83 	}
 84 
 85 	// Построение графика функции
 86 	
 87 	function Graph(F, flag, color)
 88 	{
 89 		if (!flag) return;
 90 		
 91 		context.strokeStyle = color;
 92 		context.beginPath();
 93 		for (var x = x_min; x < x_max; x += dx)
 94 		{
 95 			var y = F(x);
 96 			var X = x * sx; 
 97 			var Y = Y0 - y * sy; 
 98 			context.lineTo(X, Y);	
 99 		}
100 		context.stroke();
101 	}	
102 	
103     // Траектории
104     
105     // al = 45 * deg;
106 	function F0(x) 	
107     {
108 		var y = x - g / (v0 * v0) * x * x; 
109 		return y;
110     }    
111 
112     // Произвольное al
113 	function F1(x)
114     {
115 		var t = x / v0 / Math.cos(al) 
116 		var y = v0 * Math.sin(al) * t - g * t * t / 2; 
117 		return y;
118     }    
119 }

Файл "mg.html" 

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="UTF-8" />
 5     <title>mg</title>
 6     <script src="mg.js"></script>
 7 </head>
 8 <body>
 9     <canvas id="canvasGraph" width="400" height="упцупцупцупorder:1px solid #000000;"></canvas>
10 
11  	<!--Выбор графика (чекбоксы)-->
12 	<div>
13         Траектория:
14         <font color="#000000" size="5"><B>—</B></font>
15 		<input type="checkbox" id="checkbox_01" name="" onchange="app.setCheckbox_01(this.checked);" checked/>актуальная,
16 		<font color="CCCCCC" size="5"><B>—</B></font>
17 		<input type="checkbox" id="checkbox_02" name="" onchange="app.setCheckbox_02(this.checked);" checked/>оптимальная (<I>α</I> = 45˚)
18     </div>	
19 
20     <!--Установка параметров взаимодействия (текстовые поля и слайдеры)-->
21     <div>
22 		Угол броска:
23         <font face= "Times New Roman">
24 		<I>α</I> = <input id="Text_01" style="width: 2.2ex;" required pattern="[-+]?([0-9]*\.[0-9]+|[0-9]+)" oninput="
25             // если введено не число - строка не пройдет валидацию по паттерну выше, и checkValidity() вернет false
26             if (!this.checkValidity()) return;
27             app.set_01(this.value);
28             document.getElementById('Slider_01').value = this.value;
29         ">˚
30 		<input type="range" id="Slider_01" style="width: 100px;" oninput="app.set_01(this.value); document.getElementById('Text_01').value = this.value;">
31 		</font>
32 	</div>
33     
34 	<script type="text/javascript">var app = new MainMG(
35 		document.getElementById('canvasGraph')
36 	);</script>
37 
38 </body>
39 </html>

См. также[править]

Источник — «http://tm.spbstu.ru/?title=Траектория_тела,_брошенного_под_углом_к_горизонту&oldid=52785»