1

Делаю с помощью setInterval. Ротация - 10ms. Но не наблдюдаю плавности. Наверное не успевают бразуеры. Допустим спева идет 12мс, потом 36мс, потом 41мс Как реализовать так, чтобы все цфры было видно.

2
  • Даже опустив тот факт, что интервалы в js понятие нечёткое, просто посчитаю fps - сотня. Такое не каждый комп выдержит. 17 апр 2015 в 10:13
  • Гонки, ну как видите помиллисекундная отрисовка проигрывает, даже в таком наспех сделанном тесте. Поэтому к чему такая строгость?
    – ThisMan
    17 апр 2015 в 11:36

5 ответов 5

1

Сперва стоит заметить что setInterval как и большинство таймеров в обычной ОС — неточные. setInterval от T сработает не ранее чем T, а не точно в T.

Более того, современные мониторы обычно работают с частотой развертки в 60 герц (один кадр каждые 16 мс). Быстрее этого вы впринципе на большинстве клиентских машин не покажите.

Однако 15-20 мс это очень мало для восприятия человеком и если вам действительно надо, то можно попытаться обхитрить пользователя. При каждом выводе миллисекунд можно округлять их до 10-и. Таким образом у вас получится визуально: 00 - 10 - 20 - 30, хоть и с слегка неточным таймингом.

4
1

Предлагаю использовать вот такую хитрость:

При выводе числа сравнить то, что требуется вывести, с тем, что уже есть на экране поразрядно. Если очередной разряд изменился (цифры не равны) - циклически увеличиваем его на 1. Таким образом, число на экране может слегка запаздывать - но мелькание цифр в младших разрядах станет несколько предсказуемее.

1

1) Миллисекунды для отображения не обязательно брать из setInterval. Можно, например, взять, например из getTime(); - может лучше будет. 2) Когда не можешь программировать машину - программируй человека)) Человеческое сознание не способно на такой скорости четко воспринимать отдельные цифры (к примеру, для анимации изображения при наложении кадров один на другой, достаточно 1/12 секунды (~0,8млс) на кадр, чтобы человеческий глаз уже не воспринимал перехода между кадрами.). Поэтому можно не гнаться за реализмом, а программно подсовывать человеку то, что он должен увидеть. Причем не каждую миллисекунду, а, к примеру, раз в 2 или даже 3 миллисекунды (чтобы глаз успевал выхватить знакомую цифру). А чтобы раз за разомп не повторялись значения, можно задать пару массивов, откуда их брать (к пример, то из массива 1[2,4,6..] то из массива 2[1,3,5...]), либо еще какой-либо алгоритм. В итоге, у тебя получится иллюзия красивой смены миллисекунд

0

Нет. Это вполне возможно (лично у меня получилось). Надо использовать date и получать из него миллисекунды методом. Сразу говорю: мой пример для таймера с небольшим временным интервалом. Но можно сделать и на любой временной отрезок.

let time = document.getElementById('time');
let count = 15; //любое значение
let timeId = setInterval(function(){
        let date = new Date();
        let res = date.getMilliseconds();
        time.innerHTML = '00:' + div(count, 10) + (count%10) + ':' +  '<span>' + res + '</span>';
    }, 2);
let timeId1 = setInterval(function(){
        count--;
    if(count==-1){
            time.innerHTML = '00:00:<span>000</span>';
            alert('Время вышло');
            clearInterval(timeId);
            clearInterval(timeId1);
      }
}, 1000);
function div(x,y){ //функция для деления "нацело"
    return (x - x%y) / y;
}
#time{
    padding: 10px;
    position: absolute;
    right: 20vw;
    top: 30vh;
  box-sizing: box-border;
  width: 20vw;  /*любой размер*/
    font: 30px Digital-7 Mono;
}
#time span{
    font-size: 25px;
}
<div id='time'>00:15:<span>000</span></div>

.getMilliseconds()

-1

Как реализовать так, чтобы все цфры было видно.

Никак, есть минимальный промежуток около 20-30мс быстрее которого отобразить что-то в потоке на GUI не получится. Такое возможно только в низкоуровневом программировании.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.