function CreateChart(params) {
    params.jQuerySelector.kendoChart({
        dataSource: params.dataSource,
        title: params.title,
        legend: params.legend,
        seriesDefaults: params.seriesDefaults,
        series: params.series,
        seriesColors: params.seriesColors || null,
        valueAxis: params.valueAxis || {
            line: {
                visible: false
            },
            minorGridLines: {
                visible: true
            }
        },
        categoryAxis: params.categoryAxis || {
            majorGridLines: {
                visible: false
            }
        },
        tooltip: {
            visible: (params.tooltipTemplate) ? true : false,
            template: params.tooltipTemplate
        },
        theme: "flat"
    });
}

var data = [{
            "source": "App",
            "percentage": 22,
            "explode": true
        }, {
            "source": "sucursal",
            "percentage": 24
        }, {
            "source": "Telecanal",
            "percentage": 49
        }, {
            "source": "Web",
            "percentage": 27
        }];
        CreateChart({
            jQuerySelector: $("#chartCanals"),
            title: {
                text: "Carga de Oportunidades"
            },
            legend: {
                position: "right",
                labels: {
                    template: "#: dataItem.source # #: dataItem.percentage #%",
                    margin: {
                        right: 20
                    }
                }
            },
            dataSource: {
                data: data
            },
            series: [{
                type: "donut",
                field: "percentage",
                categoryField: "source",
                explodeField: "explode"
            }],
            seriesColors: ["#42a7ff", "#666666", "#999999", "#cccccc"],
            tooltipTemplate: "${ category } - ${ value }%"
        });