ValueAxis custom text labels

[Andreas]

Hi,

I'm trying to set custom labels on the Y-axis in a line chart, but no success. I've looked around ALOT on the forums search google without any success.
The closest to a solution I've come is to hide the actual labels and use valueAxis.notes instead.
The problem I'm facing with the notes is that the are placed directly on the horizontal lines in the chart which makes them very hard to read, and trying to use the position option doesn't seem to help anything at all. I would like to have them placed below the line, if notes are to be used.
I'd rather just be able to set the actual labels to my own strings so that instead of "0" it would say "Lousy", 25 = "Bad", 50 = "Normal" etc.

Here's is my code for the chart.

$(document).ready(function () {
    var values = [{
        "Name": "Good",
        "DateReported": "2014-03-11",
        "valueX": 75
    }, {
        "Name": "Good",
        "DateReported": "2014-03-12",
        "valueX": 75
    }, {
        "Name": "Normal",
        "DateReported": "2014-03-13",
        "valueX": 50
    }, {
        "Name": "Bad",
        "DateReported": "2014-03-14",
        "valueX": 25
    }, {
        "Name": "Awesome!",
        "DateReported": "2014-03-15",
        "valueX": 100
    }, {
        "Name": "Awesome!",
        "DateReported": "2014-03-15",
        "valueX": 100
    }, {
        "Name": "Good",
        "DateReported": "2014-03-16",
        "valueX": 75
    }, {
        "Name": "Awesome!",
        "DateReported": "2014-03-17",
        "valueX": 100
    }, {
        "Name": "Lousy",
        "DateReported": "2014-03-17",
        "valueX": 0
    }, {
        "Name": "Good",
        "DateReported": "2014-03-18",
        "valueX": 75
    }];

    $('#chart').kendoChart({
dataSource: {
                data: values
            },
            chartArea: {
                height: 350
            },
            title: {
                text: "Dina rapporterade känslor"
            },
            legend: {
                visible: false
            },
            seriesDefaults: {
                type: "line",
                style: "smooth",
                labels: {
                    visible: false,
                }
            },
            series: [{
                field: "valueX",
                name: "{0}",
                tooltip: {
                    visible: true,
                    template: "<b>Mood Score: </b>#= value #<br/><b>Mood: </b> #= dataItem.Name # "
                }
            }],
            valueAxis: {
                notes: {
                    position: "bottom",
                    icon: {
                        background: "orange"
                    },
                    data: [{
                        value: 0,
                        label: {
                            position: "outside",
                            text: "Lousy"
                        }
                    }, {
                        value: 25,
                        label: {
                            position: "outside",
                            text: "Bad"
                        }
                    }, {
                        value: 50,
                        label: {
                            position: "outside",
                            text: "Normal"
                        }
                    }, {
                        value: 75,
                        label: {
                            position: "outside",
                            text: "Good"
                        }
                    }, {
                        value: 100,
                        label: {
                            position: "outside",
                            text: "Awesome"
                        }
                    }]
                },
                title: {
                    visible: false
                },
                max: 100,
                majorUnit: 25,
                labels: {
                    format: "{0}",
                    visible: false,
                },
                line: {
                    visible: false
                }
            },
            categoryAxis: {
                title: {
                    visible: false
                },
                labels: {
                    rotation: -45
                },
                field: "DateReported",
                majorGridLines: {
                    visible: false
                }
            }
        });
});

And here is a jsFiddle.

[Andreas]

I just solved this on myself by offsetting the notes I'm using as labels by setting the "value" to 5 instead of 0, 30 instead 25, 55 instead of 50 etc.

Here is the updated jsFiddle.