Question

我需要使用kendo图表和knockout js显示图表。但是图表不会显示在页面中。任何对这个问题的帮助都会非常有用。

以下是html页面

<!DOCTYPE html>
<html>
<head>
    <link href="kendo.common.min.css" rel="stylesheet" />
    <link href="kendo.default.min.css" rel="stylesheet" />
    <script src="jquery-3.1.1.js"></script>
    <script src="bootstrap.min.js"></script>    
    <script type="knockout-3.4.0.js"></script>
    <script src="kendo.all.min.js"></script>
</head>
<body>
   <div id="countrygraph" class="k-chart" style="position: relative; touch-action: none; " data-bind="kendoChart: { data: CountryUsers, title: { text: '' }, legend:{position: 'top'},series: UserCount, seriesColors: ['lightgreen'], axisDefaults: {categories:CountryName } }"> </div>
</body>
</html>

以下是js文件。

function CountryModel() {

self = this;
self.CountryUsers = ko.observableArray([]);

function addUserCountry(countryName, userCount) {
        return {
            CountryName: ko.observable(countryName),
            UserCount: ko.observable(userCount)
        }
    }

self.CountryUsers().push(new addUserCountry('india',1));
self.CountryUsers().push(new addUserCountry('usa',2));
self.CountryUsers().push(new addUserCountry('uk',1));

}


$(document).ready(function () {
    ko.applyBindings(new CountryModel());
});

使用敲除和剑道图表显示图表

0 个答案: