Отображение диаграммы внутри KendoUI Grid

Я хочу отобразить сетку KendoUI DataViz внутри сетки KendoUI (отобразить диаграмму кендо внутри сетки кендо), и я барахтаюсь на ветру. Я думаю, что мне нужно работать либо в области шаблона, либо в области ClientTemplate сетки, но я не могу отобразить даже самые простые элементы управления.

Вот где я до сих пор...

@(Html.Kendo().Grid<StructurePurchaseDTO>()
              .Name("someGrid")
              .Columns(c =>
                           {
                               c.Bound(x => x.Structure)
                                   .Groupable(true);                                   
                               c.Bound(x => x.DomesticRatingEffect)
                                   //.ClientTemplate("#=createChart(data)#"); 
                                   //.Template(@<text>$('#numericTemplate').html()</text>);                                       
                                   //.ClientTemplate("#=createChart(data)#");
                           })
               //....removed for brevity                 
              .DataSource(ds => ds
                                    .Ajax()
                                    .PageSize(10)
                                    .Events(e=>
                                                {
                                                    e.Change("Grid_Changed");
                                                })
                                    .Read(r => r.Action("GetData", "Home"))
                                    .Model(m=>m.Id(x =>x.SimulationStructureID))

              )
  )

// это исходит непосредственно от Telerik

function createChart(data) {   //I added data b/c I will eventually need to wire this up to a DB
    $("#chart").kendoChart({
        title: {
            text: "Gross domestic product growth /GDP annual %/"
        },
        legend: {
            position: "top"
        },
        seriesDefaults: {
            type: "column"
        },
        series: [{
            name: "India",
            data: [3.907, 7.943, 7.848, 9.284, 9.263, 9.801, 3.890, 8.238, 9.552, 6.855]
        }, {
            name: "Russian Federation",
            data: [4.743, 7.295, 7.175, 6.376, 8.153, 8.535, 5.247, -7.832, 4.3, 4.3]
        }, {
            name: "Germany",
            data: [0.010, -0.375, 1.161, 0.684, 3.7, 3.269, 1.083, -5.127, 3.690, 2.995]
        }, {
            name: "World",
            data: [1.988, 2.733, 3.994, 3.464, 4.001, 3.939, 1.333, -2.245, 4.339, 2.727]
        }],
        valueAxis: {
            labels: {
                format: "{0}%"
            },
            line: {
                visible: false
            },
            axisCrossingValue: 0
        },
        categoryAxis: {
            categories: [2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011],
            line: {
                visible: false
            },
            labels: {
                padding: { top: 145 }
            }
        },
        tooltip: {
            visible: true,
            format: "{0}%",
            template: "#= series.name #: #= value #"
        }
    });
}

person Nick    schedule 17.10.2013    source источник
comment
Я пытаюсь сделать это, но с обертками MVC: jsbin.com/oletef/7/edit   -  person Nick    schedule 17.10.2013