Ползунок времени Nouslider возвращает неверные метки времени

Question

Я делаю слайдер времени, используя nouilsider. У меня есть значения год-месяц для ползунка, которые выглядят как [1979-03, 1979-06,1979-09,1979-12,1980-03], которые с интервалом в три месяца. Так как мое начальное значение 1979-03, оно должно вернуть мне метку времени для 1979-03, но когда я проверяю месяц метки времени, он возвращает мне 1, а не 3. Во-вторых, мой слайдер только скользит немного. Это мой код

    function timestamp(str) {
      var x = (new Date(str).getTime());
      return x;
    }
    noUiSlider.create(stepSlider, {
            start: timestamp('1979-01'),
            range: {
                'min': timestamp('1979-01'),
                'max': timestamp('1979-06')
            },
            step: 3*30 * 24 * 60 * 60 * 1000


        });
stepSlider.noUiSlider.on('update', function (values, handle) {
   var x = parseInt(values[handle]);
   var date = new Date(x);
   var month = date.getMonth()
   console.log(month)

Answer 1

Ваш step ценность 3*30 * 24 * 60 * 60 * 1000 не соответствует полным месяцам. Не во всех месяцах есть 30 дней, и не во всех днях есть 24 * 60 * 60 секунд.

Поскольку вы используете фиксированное количество шагов, вам лучше использовать целые числа и отображать выходные данные в месяцы:

var slider = document.getElementById('slider');

noUiSlider.create(slider, {
    start: 0,
    range: {
        'min': 0,
        'max': 5
    },
    format: {
        to: function(value) {
            return ['1979-01', '1979-02', '1979-03', '1979-04', '1979-05', '1979-06'][Math.round(value)];
        },
        from: Number
    },
    step: 1
});

slider.noUiSlider.on('update', function( values, handle ) {
    console.log(values[handle]);
});