Click here to Skip to main content
13,146,663 members (67,322 online)
Rate this:
Please Sign up or sign in to vote.
Good morning, I would like to use the library MORRIS.JS with ASP. Net, I know I must be a JSON object, but not how to do it, someone help me? As an example if I do a query on a database and want to send the data in JSON format so the library becomes MORRIS.JS the graph, can someone give me a simple example? Thanks to this community and sorry my English is not very good, I would say that is bad enough, but I will understand!

Linkt to library[^]
Posted 4-Feb-13 7:17am
Rate this: bad
Please Sign up or sign in to vote.

Solution 1

for example you can convert a generic list to json like below
public class Person
public string Name{get;set;}
public int Age{get;set;}
List<person> person=new List<person>();
person.Add(new Person{Name="Jemi","23"});
person.Add(new Person{Name="Jemi2","23"});
//Converting person list to jSon by using JavaScriptSerializer
JavaScriptSerializer jss = new JavaScriptSerializer(person);
string output = jss.Serialize(person);

Hope this helps
Garcia AlfredoS 4-Feb-13 13:57pm
agree, however I should spend the format is as follows:

* Play with this code and it'll update in the panel opposite.
* Why not try some of the options above?
element: 'donut-example',
data: [
{label: "Download Sales", value: 12},
{label: "In-Store Sales", value: 30},
{label: "Mail-Order Sales", value: 20}

I do not quite understand is how to format the data obtained either from an object in that format, can you give me a clearer example? aspx file including ... cs ..... and js.
Because that's so generic it's hard to understand, can you put the aspx ... cs and js for these three archvios form a whole that can see more clearly?
Thank you very much for your time!
Garcia AlfredoS 4-Feb-13 14:10pm
I have to agree all formatted in json output, but with the example I gave above and must form the json of morris.js, ..... I can you clarify this?
Adil Battal KAYA 6-May-14 9:55am
data: $.parseJSON(dataJson),

after serializing do parseJSON for chart data.
Rate this: bad
Please Sign up or sign in to vote.

Solution 2

I also encountered the same problem with you,just did a project on morris example,I hope to help you.
        <div id="myfirstchart" style="height: 250px; "  >
<script type="text/javascript">
     new Morris.Line({
       element: 'myfirstchart',
        data: @ViewBag.jss ,
        xkey: 'year',
        ykeys: ['value','a','b'],
        labels: ['Value','This A','this B']
      <pre lang="c#"> public ActionResult Morris()
             LineDemo lineDemo1 = new LineDemo();
             lineDemo1.value = 20;
             LineDemo lineDemo2 = new LineDemo();
             lineDemo2.year = "2009";
             lineDemo2.value = 30;
             lineDemo2.a = 40;
             lineDemo2.b = 20;
             LineDemo lineDemo3 = new LineDemo();
             lineDemo3.year = "2010";
             lineDemo3.value = 40;
             lineDemo3.a = 50;
             lineDemo3.b = 30;
             LineDemo lineDemo4 = new LineDemo();
             lineDemo4.year = "2011";
             lineDemo4.value = 25;
             lineDemo4.a = 35;
             lineDemo4.b = 55;
             List<LineDemo> listLine = new List<LineDemo>();
             JavaScriptSerializer jss = new JavaScriptSerializer();
             string output = jss.Serialize(listLine);
             string demo = output.Replace("\"", "");
             ViewBag.jss = demo;
             return View();
    public class LineDemo
        public string year{get;set;}
        public int value{get;set;}
        public int a{get;set;}
        public int b{get;set;}

The data transport by Json, It should be noted that Json' Key have quotation ,you must delete it,you can use Regular Expression . this is MVC. My English is not good.Hope you can understand.
Rate this: bad
Please Sign up or sign in to vote.

Solution 4


This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month

Advertise | Privacy |
Web03 | 2.8.170915.1 | Last Updated 28 May 2015
Copyright © CodeProject, 1999-2017
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100