Label formatting

[Chili]

Hello,

I have my labels formatted as 2011 9 (year month). Now I want to set that to the following:

sep 2011

I have tried the following:
.Labels(labels => labels.Format("{0:MMM yyyy}")

But this is not working. Someone that can provide me a solution for this?

[Chili]

Fixed it.

Only: how can i set invariant culture?

[Marin Bratanov]

Hi,

The MVC wrappers basically boil down to Kendo UI for jQuery widgets that are instantiated on the client with the settings passed from the server wrapper. Thus, there is no concept that matches InvariantCulture in .NET and the charts can default to the en-US culture if nothing else is specified. If we take the bar chart date axis demo as basis and modify it as follows (green highlights show the change), we will get the result attached at the end. I hope this will fit your needs. For more details see the categoryAxis.labels.culture property and the Kendo Widgets Globalization article.

@(Html.Kendo().Chart(Model)
.Name("chart")
.Series(series =>
{
    series
        .Column(model => model.Value, categoryExpression: model => model.Date)
        .Aggregate(ChartSeriesAggregate.Avg);
})
.CategoryAxis(axis => axis
    .Date()
    .BaseUnit(ChartAxisBaseUnit.Weeks)
    .MajorGridLines(lines => lines.Visible(false))
    .Labels(lbl => lbl.Culture("en-US").Format("MMM yyyy"))
)
.ValueAxis(axis => axis
    .Numeric()
    .Line(line => line.Visible(false))
)
)

which will result in the following in the client-side options literal:

    ...//other settings omitted for brevity
"categoryAxis": [
    {
        "labels": {
            "culture": "en-US",
            "format": "MMM yyyy"
        },
        "majorGridLines": {
            "visible": false
        },
        "baseUnit": "weeks",
        "type": "date"
    }
]
    ...//other settings omitted for brevity

 

All that said, there is another approach you can also consider depending on your use case and needs. With this example, the x-axis items are basically dates and so you have to change he format string. You can, instead, use regular, simple categories that lets you define the string representation of the date in your data source (and model) so that the chart will render the labels exactly as provided by the data source from the server. This will, however, remove the aggregates the chart does for dates, and each item will be spaced equally between the others so you will need to ensure that there are items with empty values for dates/times you want to skip from rendering in the series but to still be present in the axis.

Regards,
Marin Bratanov
Progress Telerik

[Chili]

Dear Marin,

Thank you for your well written reply! Since multiple languages will see the chart. I could make a check which system they're on and makea  var of it. And put that in the culture().

[Marin Bratanov]

Yes, this is the goal in exposing the culture in such a way. Just make sure to also include the proper cultures and messages scripts.
--Marin