суббота, 25 апреля 2020 г.

Расчет угловой и линейной скоростей онлайн

Расчет угловой и линейной скорости
Вычисляем скорость
Скорость :
Передаточное число:
Диаметр: м
Скорость :

Калькулятор угловой скорости онлайн, а также инструкция как создать свой простой калькулятор на javascript.
Чтобы сделать такой или похожий калькулятор, нужно всего лишь создать простую форму, которая будет передавать эти значения в javascript, который произведет необходимые вычисления и выдаст сразу же результат:

Сделаем переключатель режима расчета, для чего будут использоваться радиокнопки:

Вычисляем скорость <label><input name="spd" onchange="calc1()" type="radio" value="1" /> линейную (м/мин)</label> 
<label><input name="spd" onchange="calc1()" type="radio" value="60" /> угловую (об/мин)</label>

У радиокнопок есть одинаковое для всех имя, и один на всех обработчик события (onchange="calc1()" что означает что при каждом изменении будет вызываться функция calc1()).  Обработчик принимает значение каждой радикнопки, которое должно быть у каждой свое. Тег <label> нужен для того чтобы выбирать значение можно было не только кликом по кружочку, но и по самому тексту

В скрипте для считывания значения радиокнопки у нас будет такой код:

var radios = document.getElementsByName('spd'); // Получаем все элементы с именем spd
for (var i = 0, length = radios.length; i < length; i++)
if (radios[i].checked) spdform = (radios[i].value); // записываем в spdform значение выбранной радиокнопки

Добавляем форму для ввода скорости:Скорость <output id="spdfo"> </output>: <input id="speed" style="width: 100px;" type="number" value ="10"/> <output id="spdmo"> </output>

В скрипте для считывания введенного значения пишем (здесь уже поиск осуществляется по ID)(parseFloat - означает что воодимое число будет с плавающей точкой):

spd = parseFloat(document.getElementById('speed').value);

Чтобы при выборе режима, у нас менялся текст и единицы измерения, добавляем форму вывода output, а в сам вскрипт добавляем условия когда и какой текст выводить. Если выбрана радиокнопка линейной скорости, у которой значение 1, то мы в поле должны ввести угловую скорость, которая измеряется в оборотах в минуту:if (spdform==1) // значение spdform мы уже получили ранее из цикла выше
{
document.getElementById('spdfo').innerHTML = " угловая";
document.getElementById('spdmo').innerHTML = " об/мин";
} else {
document.getElementById('spdfo').innerHTML = " линейная";
document.getElementById('spdmo').innerHTML = " м/мин";


Аналогичным образом получаем значения и из форм диаметра и передаточного числа. Вывод результата осуществляется так же как и вывод текста, через форму output
Формула результата будет выглядеть так:

spdres = spdform==1 ? spd*D*3.1415/gr : spd*gr/(3.1415*D);

Здесь представлен так называемый тернарный условный оператор, который применяет разные формулы для вычисления результирующей скорости в зависимости от того какая скорость будет вычисляться: если выбрана радиокнопка со значением 1, то считается формула которая после знака вопроса, если выбрана вторая опция, то применяем формулу после двоеточия.

Ах да, совсем забыл, что для того чтобы значения вычислялись сразу в процессе ввода чисел, нужно все формы ввода и вывода обрамить конструкцией:
<form oninput="calc1()" onsubmit="return false;"> </form>
Она буквально так и читается - oninput, то есть при вводе вызывать функцию calc1()
Ниже идет полный код, который можно скопировать целиком, вставить в текстовый файл, переименовать его в html формат и запустить для проверки работы

<script type="text/javascript">
function calc1(){
var radios = document.getElementsByName('spd');
for (var i = 0, length = radios.length; i < length; i++)
if (radios[i].checked) spdform = (radios[i].value);
spd = parseFloat(document.getElementById('speed').value);
D = parseFloat(document.getElementById('dia').value);
gr = parseFloat(document.getElementById('gratio').value);
spdres = spdform==1 ? spd*D*Math.PI/gr : spd*gr/(Math.PI*D);
document.getElementById('spdres').innerHTML = (spdres).toFixed(2);
if (spdform==1)
{
document.getElementById('spdfo').innerHTML = " угловая";
document.getElementById('spdfd').innerHTML = "линейная";
document.getElementById('spdmo').innerHTML = " об/мин";
document.getElementById('spdmd').innerHTML = "м/мин";
} else {
document.getElementById('spdfo').innerHTML = " линейная";
document.getElementById('spdfd').innerHTML = " угловая";
document.getElementById('spdmo').innerHTML = " м/мин";
document.getElementById('spdmd').innerHTML = "об/мин";
}
}
</script>
<b>Расчет угловой и линейной скорости</b><br>
<form oninput="calc1()" onsubmit="return false;">
Вычисляем скорость <label><input name="spd" onchange="calc1()" type="radio" value="1" /> линейную (м/мин)</label>
<label><input name="spd" onchange="calc1()" type="radio" value="60" /> угловую (об/мин) </label><br>
Скорость <output id="spdfo"> </output>: <input id="speed" style="width: 100px;" type="number" value ="10"/> <output id="spdmo"> </output><br>
Передаточное число: <input id="gratio" style="width: 100px;" type="number" value ="1"/><br>
Диаметр: <input id="dia" style="width: 100px;" type="number" value ="1"/> м<br>
Скорость <output id="spdfd"> </output>: <strong><output id="spdres"></output></strong> <output id="spdmd"> </output><br>
</form>

Комментариев нет:

Отправить комментарий