This is a migrated thread and some comments may be shown as answers.

Chart unable to render Json string from asp.net

2 Answers 144 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

CH asked on 28 Jan 2013, 08:17 AM

1-28-2013-4-17-45-PM.png

Hi Kendo Team,
I received a funny behaviour of KendoChat (please refer to the attachment) . Need help in what i have done wrong? I am using asp.net 3.5 framework and below are my code:

KendoUI.aspx.cs

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web.Services;

public partial class KendoUI : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

[WebMethod]

public static string GetJson()

{

System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();

List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>();

Dictionary<string, object> row;

for (int i = 0; i <= 5; i++) {

row = new Dictionary<string, object>();

row.Add("country", "Singapore");

row.Add("year", (2000 + i).ToString() );

row.Add("value", 50 + i);

rows.Add(row);

}

return serializer.Serialize(rows);

}

KendoUI.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="KendoUI.aspx.cs" Inherits="KendoUI" %>

<!doctype html >

<html>

<head runat="server">

<link href="KendoCSS/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />

<script src="KendoJs/jquery.min.js" type="text/javascript"></script>

<script src="KendoJs/kendo.dataviz.min.js" type="text/javascript"></script>

<script src="KendoJs/kendo.data.min.js" type="text/javascript"></script>

</head>

<body>

<form id="form1" runat="server">

<div>

<div class="chart-wrapper">

<div id="chart" ></div>

<div id="test" />

</div>

</form>

</body>

<script>

$(document).ready(function () {

$.ajax({

type: "POST",

url: "KendoUI.aspx/GetJson",

contentType: "application/json; charset=utf-8",

dataType: "json",

success: function (data) {

if (data != "") {

$("#test").html(internetUsers);

$("#chart").kendoChart({

theme: $(document).data("kendoSkin") || "default",

dataSource: {

data: internetUsers

},

title: {

text: "Internet Users"

},

legend: {

position: "bottom"

},

seriesDefaults: {

type: "line",

labels: {

visible: true,

format: "{0}%"

}

},

series: [{

field: "value",

name: "Singapore"

}],

valueAxis: {

labels: {

format: "{0}%"

}

},

categoryAxis: {

field: "year"

}

});

}

})

});

</script>

</html>

Chart unable to render Json string from asp.net

2 Answers, 1 is accepted