为什么我的剑道图表没有被渲染？

Question

我认为 Kendo 附带的 MVC 包装器在某些情况下过于严格且难以遵循。 Telerik 添加了调用 Javascript 函数来计算图表上点颜色的功能。但是我找不到任何 MVC 的语法示例

所以我决定使用包装器来帮助生成我的 javascript 并在我的 cshtml 文件中使用它

但是，当我这样做时，我的图表没有呈现？

<div id="chartContainer" class="chartContainer">

    <script>
        function CreateChart() {
            $("#kendoChart").kendoChart({
                "chartArea": {
                    "border": {
                        "width": 1,
                        "dashType": "solid",
                        "color": "#cdcdcd"
                    }
                },
                "plotArea": {
                    "margin": {
                        "top": 0,
                        "right": 0,
                        "bottom": 0,
                        "left": 0
                    }
                },
                "legend": {
                    "visible": false
                },
                "series": [{
                    "name": "Consumption",
                    "type": "column",
                    "field": "Consumption",
                    "categoryField": "PeriodDateTime"
                }],
                "categoryAxis": [{
                    "labels": {
                        "format": "dd/MM/yy",
                        "rotation": -90,
                        "step": 48
                    },
                    "majorGridLines": {
                        "visible": false
                    },
                    "type": "date",
                    "baseUnit": "minutes",
                    "baseUnitStep": 30
                }],
                "valueAxis": [{
                    "labels": {
                        "format": "{0:N0}"
                    },
                    "line": {
                        "visible": false
                    },
                    "title": {
                        "text": "Consumption kWh"
                    }
                }],
                "transitions": false,
                "seriesColors": ["green"],
                "tooltip": {
                    "format": "{0:N0}",
                    "visible": true
                },
                "autoBind": false
            });
        }

        CreateChart();
    </script>


</div>

但是，这不渲染？

我也尝试过从 document.ready 调用 CreateChart，但也没有成功

请看下方截图

我也尝试找到包含的 div 并调用 appendChild，但我收到一条错误消息，指出没有方法 appendChild？

有谁知道我做错了什么？这一定是非常明显的事情，但我看不到！

保罗

Answer 1

您的图表构造对象中没有数据源。您必须指定它：

$("#chart").kendoChart({
    dataSource: {
         data: [
            { price: 10 },
            { price: 20 }
        ]
    }
    ...
});

或明确输入系列：

$("#chart").kendoChart({
    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: "World",
        data: [1.988, 2.733, 3.994, 3.464, 4.001, 3.939, 1.333, -2.245, 4.339, 2.727]
    }],
    ...
});

您可以在此处找到有关图表数据源的更多信息：http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart#configuration-dataSource。