Траектория тела, брошенного под углом к горизонту — различия между версиями
Материал из Department of Theoretical and Applied Mechanics
(Новая страница: «Виртуальная лаборатория > Траектория тела, брошенного под углом к горизонту <HR> Рассм...») |
|||
Строка 26: | Строка 26: | ||
y = x\mathop{\rm tg}\alpha - \frac{g}{2v_0^2\cos^2\alpha}\,x^2. | y = x\mathop{\rm tg}\alpha - \frac{g}{2v_0^2\cos^2\alpha}\,x^2. | ||
</math> | </math> | ||
+ | |||
+ | Таким образом, траектория является параболой, ее вид отображен на интерактивном графике ниже. На графике сравнивается траектория, соответствующая <math>\alpha = 60^o</math> и оптимальная траектория, реализующаяся при <math>\alpha = 45^o</math> и обеспечивающая максимальную дальность броска. Перемещение слайдера позволяет наблюдать влияние угла броска на форму и параметры траектории. | ||
+ | |||
+ | <addscript src=mg/> | ||
+ | <htmlet nocache="yes">mg_TM</htmlet> | ||
+ | Текст программы построения графиков на языке JavaScript: <toggledisplay status=hide showtext="Показать↓" hidetext="Скрыть↑" linkstyle="font-size:default"> | ||
+ | Файл '''"mg.js"''' | ||
+ | <source lang="javascript" first-line="1"> | ||
+ | // Движение тела, брошенного под углом к горизонту | ||
+ | // Разработчик А.М. Кривцов | ||
+ | // 01.06.2014 | ||
+ | // Интернет: tm.spbstu.ru/mg | ||
+ | |||
+ | function MainMG(canvas) { | ||
+ | |||
+ | // Предварительные установки | ||
+ | |||
+ | const deg = Math.PI / 180; // Угловой градус (degree) | ||
+ | |||
+ | const X_max = canvas.width; | ||
+ | const Y_max = canvas.height; | ||
+ | |||
+ | // Размерные параметры | ||
+ | |||
+ | const g = 1.; // ускорение свободного падения | ||
+ | const v0 = 1.; // начальная скорость | ||
+ | |||
+ | // Расчет констант | ||
+ | |||
+ | const h = v0 * v0 / 2 / g; | ||
+ | |||
+ | // Задание начальных значений параметров | ||
+ | |||
+ | var al = 60 * deg; | ||
+ | |||
+ | // Область построения графика | ||
+ | const x_min = 0; | ||
+ | const x_max = 2 * h; | ||
+ | const y_min = 0; | ||
+ | const y_max = h; | ||
+ | |||
+ | const N = X_max; // число точек по оси x | ||
+ | const dx = x_max / N; // шаг по оси x | ||
+ | const sx = X_max / x_max; // масштаб по оси x | ||
+ | |||
+ | var sy; // масштаб по оси y | ||
+ | var Y0; // положение 0 оси y в экранных координатах | ||
+ | var context; // на context происходит рисование | ||
+ | |||
+ | // настройка слайдеров и текстовых полей | ||
+ | |||
+ | Text_01.value = Math.round(al / deg); | ||
+ | Slider_01.min = 0; | ||
+ | Slider_01.max = 90; | ||
+ | Slider_01.step = 1; | ||
+ | Slider_01.value = Text_01.value; | ||
+ | |||
+ | draw(); | ||
+ | |||
+ | // функция, запускающаяся при перемещении слайдера | ||
+ | this.set_01 = function(input) { al = input * deg; draw(); } | ||
+ | |||
+ | // Функции, запускающиеся при изменении элементов управления | ||
+ | this.setCheckbox_01 = function(bool) { draw(); } | ||
+ | this.setCheckbox_02 = function(bool) { draw(); } | ||
+ | |||
+ | // Отображение | ||
+ | |||
+ | function draw() | ||
+ | { | ||
+ | // Расчет параметров графики | ||
+ | |||
+ | sy = Y_max / (y_max - y_min); // масштаб по оси y | ||
+ | Y0 = Y_max + y_min * sy; // положение 0 оси y в экранных координатах | ||
+ | |||
+ | context = canvas.getContext("2d"); // на context происходит рисование | ||
+ | context.clearRect(0, 0, X_max, Y_max); // очистить экран | ||
+ | |||
+ | // Графики | ||
+ | |||
+ | Graph(F0, checkbox_02.checked, 'lightgrey'); | ||
+ | Graph(F1, checkbox_01.checked, 'black'); | ||
+ | |||
+ | // Надписи | ||
+ | context.fillStyle = 'black'; | ||
+ | context.font = "italic 20px Times"; | ||
+ | context.fillText("x", x_max * sx - 15, Y0 - 7); | ||
+ | context.fillText("y", 5, 15); | ||
+ | context.fillText("0", 10, Y0 - 3); | ||
+ | } | ||
+ | |||
+ | // Построение графика функции | ||
+ | |||
+ | function Graph(F, flag, color) | ||
+ | { | ||
+ | if (!flag) return; | ||
+ | |||
+ | context.strokeStyle = color; | ||
+ | context.beginPath(); | ||
+ | for (var x = x_min; x < x_max; x += dx) | ||
+ | { | ||
+ | var y = F(x); | ||
+ | var X = x * sx; | ||
+ | var Y = Y0 - y * sy; | ||
+ | context.lineTo(X, Y); | ||
+ | } | ||
+ | context.stroke(); | ||
+ | } | ||
+ | |||
+ | // Траектории | ||
+ | |||
+ | // al = 45 * deg; | ||
+ | function F0(x) | ||
+ | { | ||
+ | var y = x - g / (v0 * v0) * x * x; | ||
+ | return y; | ||
+ | } | ||
+ | |||
+ | // Произвольное al | ||
+ | function F1(x) | ||
+ | { | ||
+ | var t = x / v0 / Math.cos(al) | ||
+ | var y = v0 * Math.sin(al) * t - g * t * t / 2; | ||
+ | return y; | ||
+ | } | ||
+ | } | ||
+ | </source> | ||
+ | Файл '''"mg.html"''' | ||
+ | <source lang="html" first-line="1"> | ||
+ | <!DOCTYPE html> | ||
+ | <html> | ||
+ | <head> | ||
+ | <meta charset="UTF-8" /> | ||
+ | <title>mg</title> | ||
+ | <script src="mg.js"></script> | ||
+ | </head> | ||
+ | <body> | ||
+ | <canvas id="canvasGraph" width="400" height="200" style="border:1px solid #000000;"></canvas> | ||
+ | |||
+ | <!--Выбор графика (чекбоксы)--> | ||
+ | <div> | ||
+ | Траектория: | ||
+ | <font color="#000000" size="5"><B>—</B></font> | ||
+ | <input type="checkbox" id="checkbox_01" name="" onchange="app.setCheckbox_01(this.checked);" checked/>актуальная, | ||
+ | <font color="CCCCCC" size="5"><B>—</B></font> | ||
+ | <input type="checkbox" id="checkbox_02" name="" onchange="app.setCheckbox_02(this.checked);" checked/>оптимальная (<I>α</I> = 45˚) | ||
+ | </div> | ||
+ | |||
+ | <!--Установка параметров взаимодействия (текстовые поля и слайдеры)--> | ||
+ | <div> | ||
+ | Угол броска: | ||
+ | <font face= "Times New Roman"> | ||
+ | <I>α</I> = <input id="Text_01" style="width: 2.2ex;" required pattern="[-+]?([0-9]*\.[0-9]+|[0-9]+)" oninput=" | ||
+ | // если введено не число - строка не пройдет валидацию по паттерну выше, и checkValidity() вернет false | ||
+ | if (!this.checkValidity()) return; | ||
+ | app.set_01(this.value); | ||
+ | document.getElementById('Slider_01').value = this.value; | ||
+ | ">˚ | ||
+ | <input type="range" id="Slider_01" style="width: 100px;" oninput="app.set_01(this.value); document.getElementById('Text_01').value = this.value;"> | ||
+ | </font> | ||
+ | </div> | ||
+ | |||
+ | <script type="text/javascript">var app = new MainMG( | ||
+ | document.getElementById('canvasGraph') | ||
+ | );</script> | ||
+ | |||
+ | </body> | ||
+ | </html> | ||
+ | </source> | ||
+ | </toggledisplay> | ||
Версия 21:31, 1 июня 2014
Виртуальная лаборатория > Траектория тела, брошенного под углом к горизонту
Рассмотрим движение материальной точки, брошенной под углом к горизонту в поле силы тяжести. Пренебрежем сопротивлением. Тогда уравнение движения рассматриваемой системы и начальные условия имеют вид:
где
и — масса и радиус-вектор материальной точки, — сила тяжести, — начальная скорость, — время, точкой обозначена производная по времени, векторы выделены жирным шрифтом. Решение уравнения имеет вид:Проецируя полученное векторное уравнение на горизонтальную и вертикальную оси
и получимгде
— угол между направлением начальной скорости и горизонтальным направлением (угол броска). После исключения времени из этих уравнений получим уравнение траекторииТаким образом, траектория является параболой, ее вид отображен на интерактивном графике ниже. На графике сравнивается траектория, соответствующая
и оптимальная траектория, реализующаяся при и обеспечивающая максимальную дальность броска. Перемещение слайдера позволяет наблюдать влияние угла броска на форму и параметры траектории.<addscript src=mg/>
Не удается найти HTML-файл mg_TM.html
Текст программы построения графиков на языке JavaScript: <toggledisplay status=hide showtext="Показать↓" hidetext="Скрыть↑" linkstyle="font-size:default">
Файл "mg.js"
// Движение тела, брошенного под углом к горизонту
// Разработчик А.М. Кривцов
// 01.06.2014
// Интернет: tm.spbstu.ru/mg
function MainMG(canvas) {
// Предварительные установки
const deg = Math.PI / 180; // Угловой градус (degree)
const X_max = canvas.width;
const Y_max = canvas.height;
// Размерные параметры
const g = 1.; // ускорение свободного падения
const v0 = 1.; // начальная скорость
// Расчет констант
const h = v0 * v0 / 2 / g;
// Задание начальных значений параметров
var al = 60 * deg;
// Область построения графика
const x_min = 0;
const x_max = 2 * h;
const y_min = 0;
const y_max = h;
const N = X_max; // число точек по оси x
const dx = x_max / N; // шаг по оси x
const sx = X_max / x_max; // масштаб по оси x
var sy; // масштаб по оси y
var Y0; // положение 0 оси y в экранных координатах
var context; // на context происходит рисование
// настройка слайдеров и текстовых полей
Text_01.value = Math.round(al / deg);
Slider_01.min = 0;
Slider_01.max = 90;
Slider_01.step = 1;
Slider_01.value = Text_01.value;
draw();
// функция, запускающаяся при перемещении слайдера
this.set_01 = function(input) { al = input * deg; draw(); }
// Функции, запускающиеся при изменении элементов управления
this.setCheckbox_01 = function(bool) { draw(); }
this.setCheckbox_02 = function(bool) { draw(); }
// Отображение
function draw()
{
// Расчет параметров графики
sy = Y_max / (y_max - y_min); // масштаб по оси y
Y0 = Y_max + y_min * sy; // положение 0 оси y в экранных координатах
context = canvas.getContext("2d"); // на context происходит рисование
context.clearRect(0, 0, X_max, Y_max); // очистить экран
// Графики
Graph(F0, checkbox_02.checked, 'lightgrey');
Graph(F1, checkbox_01.checked, 'black');
// Надписи
context.fillStyle = 'black';
context.font = "italic 20px Times";
context.fillText("x", x_max * sx - 15, Y0 - 7);
context.fillText("y", 5, 15);
context.fillText("0", 10, Y0 - 3);
}
// Построение графика функции
function Graph(F, flag, color)
{
if (!flag) return;
context.strokeStyle = color;
context.beginPath();
for (var x = x_min; x < x_max; x += dx)
{
var y = F(x);
var X = x * sx;
var Y = Y0 - y * sy;
context.lineTo(X, Y);
}
context.stroke();
}
// Траектории
// al = 45 * deg;
function F0(x)
{
var y = x - g / (v0 * v0) * x * x;
return y;
}
// Произвольное al
function F1(x)
{
var t = x / v0 / Math.cos(al)
var y = v0 * Math.sin(al) * t - g * t * t / 2;
return y;
}
}
Файл "mg.html"
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>mg</title>
<script src="mg.js"></script>
</head>
<body>
<canvas id="canvasGraph" width="400" height="200" style="border:1px solid #000000;"></canvas>
<!--Выбор графика (чекбоксы)-->
<div>
Траектория:
<font color="#000000" size="5"><B>—</B></font>
<input type="checkbox" id="checkbox_01" name="" onchange="app.setCheckbox_01(this.checked);" checked/>актуальная,
<font color="CCCCCC" size="5"><B>—</B></font>
<input type="checkbox" id="checkbox_02" name="" onchange="app.setCheckbox_02(this.checked);" checked/>оптимальная (<I>α</I> = 45˚)
</div>
<!--Установка параметров взаимодействия (текстовые поля и слайдеры)-->
<div>
Угол броска:
<font face= "Times New Roman">
<I>α</I> = <input id="Text_01" style="width: 2.2ex;" required pattern="[-+]?([0-9]*\.[0-9]+|[0-9]+)" oninput="
// если введено не число - строка не пройдет валидацию по паттерну выше, и checkValidity() вернет false
if (!this.checkValidity()) return;
app.set_01(this.value);
document.getElementById('Slider_01').value = this.value;
">˚
<input type="range" id="Slider_01" style="width: 100px;" oninput="app.set_01(this.value); document.getElementById('Text_01').value = this.value;">
</font>
</div>
<script type="text/javascript">var app = new MainMG(
document.getElementById('canvasGraph')
);</script>
</body>
</html>
</toggledisplay>