axisTitles

adds axis titles for a slider or range slider

boolean|function axisTitles;

Values

true

displays the numeric value below each step mark on the slider axis

function

a function that takes the step value as a parameter and returns a custom string label; return an empty string to skip a label for a given step

Example

{ 
    view: "slider",
    label: "Auto axis based on values and step",
    labelPosition: "top",
    value: 6, 
    axisTitles: true, 
    min: 0, max: 10,
}
 
// axisTitles set as a function
{ 
    view: "slider", 
    label: "Custom axis with some titles", 
    labelPosition: "top",
    value: 0, 
    min: -10, max: 10,
    title: webix.template("#value#"),
    axisTitles: v => {
            switch (v) {
            case -10: return "Low";
            case 0: return "Normal";
            case 10: return "Great";
            default: return "";
        }
    }
}

Default value:

false

Related samples

Details

When set to true, the slider displays a numeric label below each step mark along the axis. The labels are generated automatically based on the min, max, and step values.

When set to a function, the function receives each step value and should return a string to display as the label for that step. To leave a step unlabeled, return an empty string.