How to use Morris chart

Morris.js is the library, It’s a very simple API for drawing line, bar, area and donut charts.There I’m describing example of morris chart which is very simple
How to use Morris Line chart:

Morris.Line({
    element: 'myfirstchart'
    data: [
        {  year: '2008', value: 20 }
        {  year: '2009', value: 10 }
        {  year: '2010', value: 5 }
        {  year: '2011', value: 2 }
        {  year: '2012', value: 20 }
    ]
    xkey: 'year'
    ykeys: ['value']
    labels: ['Value']
    });

Output:

How to use Morris Area chart:

Morris.Area({
    element: 'myfirstchart'
    data: [
        {  year: '2008', value: 20 }
        {  year: '2009', value: 10 }
        {  year: '2010', value: 5 }
        {  year: '2011', value: 2 }
        {  year: '2012', value: 20 }
    ]
    xkey: 'year'
    ykeys: ['value']
    labels: ['Value']
    });

Output:

How to use Bar chart:

Morris.Bar({
    element: 'myfirstchart'
    data: [
        {  year: '2008', value: 20 }
        {  year: '2009', value: 10 }
        {  year: '2010', value: 5 }
        {  year: '2011', value: 2 }
        {  year: '2012', value: 20 }
    ]
    xkey: 'year'
    ykeys: ['value']
    labels: ['Value']
    });

Output:

How to use stack bar chart:

Morris.Bar({
    element: 'myfirstchart'
    data: [
        {  year: '2008', stack1: 20,stack2:30,stack3:5 }
        {  year: '2009', stack1: 10 ,stack2:40,stack3:10}
        {  year: '2010', stack1: 5 ,stack2:40,stack3:20}
        {  year: '2011', stack1: 2 ,stack2:35,stack3:40}
        {  year: '2012', stack1: 20 ,stack2:20,stack3:90}
    ]
    xkey: 'year'
    ykeys: ['stack1','stack2','stack3']
    labels: ['stack1','stack2','stack3'],
    stacked:true
    });

Output: