Observable parameter changes data source

[rwb]

I want to make a simple example where dragging the slider updates the pie chart.

How?

I don't understand how to makethe graph data depend on the value of the slider.

 

        var viewModel = kendo.observable({
            turnips: 35,
            coconuts: function() {
                data: [{
                    category: "Big",
                    value: this.get("turnips"),
                    color: "#9de219"
                }, {
                    category: "Small",
                    value: 100 - 10 - this.get("turnips"),
                    color: "#90cc38"
                }, {
                    category: "As big as your head",
                    value: 10,
                    color: "#068c35"
                }]
            }
        });

        $(document).ready(function () {
            var slider = $("#slider").kendoSlider({
                min: 30,
                max: 60,
                smallStep: 1,
                largeStep: 5,
                showButtons: false
            }).data("kendoSlider");

            $("#elt1").kendoChart({
                title: {
                    position: "bottom",
                    text: "Coconuts"
                },
                legend: {
                    visible: false
                },
                chartArea: {
                    background: ""
                },
                seriesDefaults: {
                    labels: {
                        visible: true,
                        background: "transparent",
                        template: "#= category #: \n #= value#%"
                    }
                },
                series: [{
                    type: "pie",
                    startAngle: 90,
                    data: viewModel.coconuts
                }],
                tooltip: {
                    visible: true,
                    format: "{0}%"
                }
            });


            kendo.bind($('#view'), viewModel);
        });

[rwb]

https://dojo.telerik.com/oCuGug/3

 

This ought to be so simple but it's absolutely bloody impossible.

[rwb]

https://dojo.telerik.com/EFigu

[Dimitar]

Hello Richard,

I am glad to see that you have managed to successfully resolve the issue that you were facing. 

You have indeed figured out how to properly retrieve the "big" field value of the ViewModel by using the get() method.

Thank you for sharing the solution.

Regards,
Dimitar
Progress Telerik