Can't keep the chart type after calling read() method

[Conta Mercer]

Hi,
I have one chart that can be set as column, bar, line and area by a radio input and I'd implemented the refresh method to update the chart for a selected type. I also have a slider where I can change a date and the datasource is updated. The problem is that when the read() method is called after a date is changed doesn't matter if I'd chosen the bar, line or area type, the chart goes back to the default type (stacked column) that was set on MVC sintax. Is there a property that I should set to keep the chart type the same it was before the datatasource update and the read() call?

[T. Tsonev]

Hi,

Changes can be made permanent by using setOptions, e.g.:

chart.setOptions({ seriesDefaults: { type: "bar" } });

Live demo

If this doesn't help we'd appreciate a code sample that we can debug.

Regards,
T. Tsonev
Telerik

[Conta Mercer]

As you asked I've attached the project. I'll try to explain in a better way the problems I'm having...

1. I have a chart which the user can change its type by clicking on a radio button and change the month/year via slider. The problem is that when a user choose a another type like the line type and moves the slider  the chart comes back to the default type (column chart).

2. The area chart breaks the other types of chart, e.g., if I select a line chart first, I can see the dots on each month, but if I choose the area chart and come back to the line chart, the dots disappear.

3. And to finish, the legend color does not follow the series color.

Thank you in advance.

Marcio Aguiar

[T. Tsonev]

Hello,

Thank you for providing a sample project.

Changing the series type on the fly is really not straight forward. We'll try to improve this in future versions.
One possible workaround is to redefine the series completely:

    function refresh() {
        var currentChart = $('#DemoChart');

        var chart = currentChart.data("kendoChart"),
            series = chart.options.series,
            type = $("input[name=seriesType]:checked").val(),
            stack = $("#stack").prop("checked");
        
        chart.setOptions({
            series: [{
                "name":"#= group.items[0].Descricao #",
                "opacity":1,
                "type":type,
                "stack":stack,
                "field":"Valor",
                //"colorField":"Cor"
            }],
            transitions: false
        });
        
        chart.dataSource.read();
    }

The last call to read() shouldn't be necessary and we'll look into that as well.

This takes care of the first two issues.

The third issue is by design, the legend doesn't follow the series color when color binding is used.
Normally, you'd have multiple colors per series and the legend will always show the one assigned to the series.

I hope this helps.

Regards,
T. Tsonev
Telerik