Use Kendo Ui Loading Indicator with dataviz

Question

I've a little problem using Kendo UI Dataviz.

The rendering takes around 15-20 seconds so I've to show a loading indicator.

Kendo says to use kendo.ui.progress (http://docs.kendoui.com/api/web/ui).

It works well for a any div but not for Datawiz ... I can't make it works ... It does nothing ...

Here my code :

<div class="chart-wrapper">
    @(Html.Kendo().Chart<SerialisableCustomer>()
        .Name("chart")
        .Title("Répartition du CA généré par les agences")
        .(dataSource =>
        {
            ....
        })
</div>
<script>
    var ajaxContainer = $("#chart");

    // show loading overlay
    kendo.ui.progress(ajaxContainer, true);

    // hide loading overlay
    //kendo.ui.progress(ajaxContainer, false);

</script>

Does anyone have an idea ?

Thanks in advance

Answer 1

Ok well i found the problem ...

The div of the chart was not yet created when i called the kendo.ui.progress function.

I had to delayed it with jquery ready :

$(document).ready(function () {

    var ajaxContainer = $("#chart");

    // show loading overlay
    kendo.ui.progress(ajaxContainer, true);

});