Evenly spaced range of discrete values

[xeruf]

Hey, I would like to have a slider with a list of evenly-spaced values. Is there a way to implement that easily now without having to calculate percentages for each?

My feature suggestion here would be to have range also accept an array, which would then be evenly spaced automatically.

[leongersen]

Good suggestion. This would look like this:

var values = [20, 50, 60, 80, 90, 110];
var len = values.length;
var range = { min: values[0] };

for (var i = 1; i < len; i++) {
    var key;

    if (i === len - 1) {
        key = 'max';
    } else {
        key = (100 / (len - 1) * i) + '%';
    }

    range[key] = values[i];
}

This could be added as a utility, like noUiSlider.create(slider, { range: noUiSlider.buildRange([20, 50, 60, 80, 90, 110]), .... I'd just want to think about how a step value could be added.

[xeruf]

Wow, thank you! There is one thing I forgot to mention: What if the values are not numbers but could also be strings - would I have to do a mapping via from-to? This was what I meant with discrete values, actually.

[leongersen]

Yes, you'd need to set up format to translate between a numeric range and the string values (if they are not numeric).

[leongersen]

There is now an example on using an array of values in the documentation.

[github-actions[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.