Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   время анимации (https://javascript.ru/forum/misc/79139-vremya-animacii.html)

pavelxodos 23.12.2019 16:09

время анимации
 
есть команда сортировки которая размещает объекты в зависимости от изменения значения, можно ли сделать так чтобы перемещение объекта происходило не мгновенно а плавно?
var layerCounts = [comp("1").layer("Слой-фигура 2").effect("Элемент управления точкой")("Точка")[0], comp("2").layer("Слой-фигура 2").effect("Элемент управления точкой")("Точка")[0], comp("3").layer("Слой-фигура 2").effect("Элемент управления точкой")("Точка")[0], comp("4").layer("Слой-фигура 2").effect("Элемент управления точкой")("Точка")[0]];
arr = layerCounts.sort(function(a, b) {return b - a});
var el1 = thisComp.layer("Слой-фигура 2").effect("Элемент управления точкой")("Точка")[0];
temp = ((arr.indexOf(el1))+1)*68-43;
[80, temp]

то есть чтоб изменение значения temp происходило плавно

Malleys 23.12.2019 16:25

Цитата:

Сообщение от pavelxodos
то есть чтоб изменение значения temp происходило плавно

Я правильно понимаю, что у вас эти значения [80, temp] используются в качестве значении для CSS-свойств top, left? Или transform? Если оно так и есть, вы можете использовать, например, стиль transition: 500ms; на объекте!

pavelxodos 23.12.2019 16:36

используется для управления transform.position, если можно скажите конкретней как привязать этот стиль и время к моему коду
p. s. я не совсем программист а этот код собирал не один час из того что находил в интернете

pavelxodos 26.12.2019 12:17

Malleys,
так можно только в css а мне нужно на js

Malleys 26.12.2019 12:33

Цитата:

Сообщение от pavelxodos
так можно только в css а мне нужно на js

Так экспериментируйте со временем... откуда я могу знать, что у вас там...
var layerCounts = [
	comp("1").layer("Слой-фигура 2").effect("Элемент управления точкой")("Точка")[0],
	comp("2").layer("Слой-фигура 2").effect("Элемент управления точкой")("Точка")[0],
	comp("3").layer("Слой-фигура 2").effect("Элемент управления точкой")("Точка")[0],
	comp("4").layer("Слой-фигура 2").effect("Элемент управления точкой")("Точка")[0]
];
var arr = layerCounts.sort(function(a, b) {
	return b - a
});
var el1 = thisComp.layer("Слой-фигура 2").effect("Элемент управления точкой")("Точка")[0];
var from = 68 * layerCounts.indexOf(el1) + 25;
var to = 68 * arr.indexOf(el1) + 25;
[80, (to - from) * Math.min(1, 0.1 * time) + from]

pavelxodos 26.12.2019 13:20

Malleys,
var from = transform.position[1];
var to = 68 * arr.indexOf(el1) + 25;
[80, (to - from) * Math.min(1, 0.1 * time) + from]

проблема в том что и from и to динамические, то есть перемещение объекта которому я пытаюсь задать координаты, может происходить n-ое количество раз, пытался взять разницу разделить на количество кадров в секунду и задать интервал - тоже не получилось
var z = from
var r = (to - from)/25;
let timer = setInterval(function() {
  z += r
}, 20);
[80, z]

pavelxodos 26.12.2019 17:07

Malleys,
можете хотя бы сказать это вообще возможно сделать? а то уже несколько дней безрезультатных поисков по сети

рони 26.12.2019 18:13

Цитата:

Сообщение от pavelxodos
несколько дней безрезультатных поисков

похоже один Malleys, понимает на каком наречии js вы пишите.

pavelxodos 26.12.2019 18:26

рони,
программа афтер эфектс скрипты пишу чтоб не выполнять одно и то же действие много раз, я думал язык javascript один
var z = from
var r = (to - from)/25;
let timer = setInterval(function() {
  z += r
}, 20);
[80, z]
z значение (координата) изменяется от from к to
цель: добиться чтоб значение z изменялось не мгновенно после смены to а за одну секунду (как бы плавно) значение to тоже может меняться во времени

Malleys 26.12.2019 19:22

Цитата:

Сообщение от pavelxodos
можете хотя бы сказать это вообще возможно сделать? а то уже несколько дней безрезультатных поисков по сети

Конечно же можно сделать. Ваш setInterval, как я вам уже писал, не имеет смысла в вычисляемом выражении, поскольку выражение вычисляется «синхронно», а setInterval предполагает ожидание. Используйте показание времени time вместо setInterval.

Цитата:

Сообщение от pavelxodos
количество раз, пытался взять разницу разделить на количество кадров в секунду и задать интервал - тоже не получилось

Вы что-то явно усложняете...


Цитата:

Сообщение от pavelxodos
а то уже несколько дней безрезультатных поисков по сети

В сети есть миллионы уроков на эту тему. Например, можно поискать в YouTube.

https://www.youtube.com/watch?v=BDY9eCWcOfQ

https://www.youtube.com/results?sear...ns&sp=CAI%253D
https://www.youtube.com/results?sear...sions+tutorial
https://www.youtube.com/results?sear...8F&sp=CAI%253D


Часовой пояс GMT +3, время: 15:12.