Задачка с цифрами
Здравствуйте!
На JS получается периодически меняющееся число (0,1,2,3... т.д.) строго от 0 и до 300(Может быть любое другое) . Как на основе этого значения сделать переменную которая будет сохранять в себе значение по системе: Наше число N меняется до 20 и переменная становиться 20 но если N будет 21 то переменная будет иметь значение 19, и так до тех пор пока не дойдёт до значения 0, после чего числовое значение будет опять прибавляться, если N = 41 то переменная вернёт значение 1. И так постоянно пока увеличивается само значение N. Надеюсь объяснил достаточно понятно. Есть у кого идеи? Извиняюсь за название не знаю как назвать то что хочу сделать. |
Цитата:
|
возрастающая синусоида
Biotoxsin,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
body{
display: flex;
position: relative;
}
circle {
width: 35px;
height: 35px;
background-color: red;
border-radius: 50%;
position: absolute;
font: 900 1.3em / 4px "Alfa Slab One", sans-serif;
text-align: center;
line-height: 35px;
}
</style>
</head>
<body>
<script>
let limit = 20;
let k = 0;
let b = 1;
const html = Array.from({length : 300}, (v, n) => {
const circle = document.createElement("circle");
circle.textContent = k;
Object.assign(circle.style, {left : `${n * 15}px`, top : `${k * 30}px`});
k += b;
if(k == limit|| !k) b *= -1;
if(!k && b == 1) limit += 20;
return circle
});
document.body.append(...html)
</script>
</body>
</html>
|
Спасибо
|
Цитата:
ЕЩЁ То, что хочет сделать автор темы, определённо имеет отношение к параболе... https://www.desmos.com/calculator/7jowhxgmmi Вот вычисление по формуле...
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
circle {
width: 35px;
height: 35px;
background-color: red;
border-radius: 50%;
position: absolute;
font: 900 1.3em / 4px sans-serif;
text-align: center;
line-height: 35px;
}
</style>
</head>
<body>
<script>
function fn(x) {
return Math.abs(Math.floor(Math.sqrt(x)) - Math.abs(x - Math.floor(Math.sqrt(x)) ** 2));
}
for(let from = 0, to = 300, x = from; x < to; x++) {
const circle = document.createElement("circle");
const y = 20 * fn(x / 20);
circle.textContent = Math.round(y);
Object.assign(circle.style, {
left: `${x * 15}px`,
top: `${y * 30}px`
});
document.body.append(circle);
}
</script>
</body>
</html>
|
Malleys,
:) |
Цитата:
Цитата:
|
Цитата:
|
Цитата:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
circle {
width: 35px;
height: 35px;
background-color: red;
border-radius: 50%;
position: absolute;
font: 900 1.3em / 4px sans-serif;
text-align: center;
line-height: 35px;
}
</style>
</head>
<body>
<script>
function fn(x) {
return 0.5 + Math.asin(Math.sin(Math.PI * (x - 0.5))) / Math.PI;
}
for(let from = 0, to = 300, x = from; x < to; x++) {
const circle = document.createElement("circle");
const y = 20 * fn(x / 20);
circle.textContent = Math.round(y);
Object.assign(circle.style, {
left: `${x * 15}px`,
top: `${y * 30}px`
});
document.body.append(circle);
}
</script>
</body>
</html>
Цитата:
|
Malleys, А что делать если нужно получить такую же структуру только с отрицательным значением от -10 до 10? (именно по Вашему методу, у Рони всё ясно)
|
| Часовой пояс GMT +3, время: 17:02. |