Give a Linear Gauge custom labels

旧巷老猫 提交于 2019-12-11 09:27:21

问题


I have a kendo linear gauge defined like this...

$("#gauge").kendoLinearGauge({

    pointer: {
        value: 4.5,
        shape: "arrow"
    },

    scale: {
        majorUnit: 1,
        minorUnit: 1,
        max: 6,
        ranges: [
            {
                from: 0,
                to: 1,
                color: "#ffc700"
            }, {
                from: 1,
                to: 2,
                color: "#ff7a00"
            }, {
                from: 2,
                to: 3,
                color: "#c20000"
            }, {
                from: 3,
                to: 4,
                color: "#FF0000"
            }, {
                from: 4,
                to: 5,
                color: "#00FF00"
            }, {
                from: 5,
                to: 6,
                color: "#0000FF"
            }
        ]
    }
});

And this produces a gauge that looks like this...

What I want to do is replace the numeric labels with string values like "Unverified", "Verified", "Open", etc so that I end up with something more akin to this...

I'm fairly confident that I should be able to do this using a template, but I can't get even the simplest of examples (including the one shown below from the telerik website) to work.

$("#linear-gauge").kendoLinearGauge({
     scale: {
         labels: {
             // labels template
             template: "#= value #%"
         }
     }
});

Can anyone offer any suggestions?


回答1:


Create a template function

template: function (rec) {
    var label;
    switch (rec.value) {
        case 0:
            label = 'un verified';
            break;
        case 1:
            label = 'verified';
            break;
        default:
            label = 'open';
    }
    return label;
}

http://dojo.telerik.com/@harsh/EgeVa



来源:https://stackoverflow.com/questions/28903919/give-a-linear-gauge-custom-labels

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!