javascript - ハンドルの方向を変更した後の noUiSlider 値が未定義

Question

スライダーを作成しorientation:'vertical' 、「スパン」を変更してリンクし、スライダーをドラッグ/タップするときに値を更新および設定できるようにします。それはうまく機能しますが、ハンドルを下部に配置するとすぐに、direction: 'rtl'出力がスパンされますundefined。

スライダーは水平ですが、NoUiSliderサイトで同じ問題を見ましたが、問題はまだあります。

デフォルトではdirection、スライダーのハンドルは"ltr"「左から右」に設定されています。スライダーの向きがverticalハンドルに設定されている場合は、同じように動作し、「ltr = 上から下」または「rtl = 下から上」のいずれかを調整します。

var slider = document.getElementById('sl1');
noUiSlider.create(slider, {
    start: 1,
    step: 1,
    connect: 'lower',
    direction: 'rtl',
    orientation: 'vertical',
    range: {
        'min': 1,
        'max': 32
    },
    format: wNumb({
        decimals: 0,
    })
});

var input = document.getElementById('input-with-keypress1');

slider.noUiSlider.on('update', function(values, handle) {
    input.value = values[handle]; //When the slider value changes, update the   input
});

slider.noUiSlider.on('set', function(values, handle) {
            input.value = values[handle];

JsFiddleデモ

理由はわかりませんが、外部リソース リンクがスライダーをレンダリングしないようです。すみませんが、私は初心者で、構文が間違っているだけかもしれません (ただし、ローカルで動作します)。