Clever Geek Handbook

Reverse order of the y-axis in a linear Morris chart

Is it possible to set the y-axis values ​​in reverse order (0-100)? The maximum value at the top must start from zero to 100.

Morris.Line({
     element: 'line-example',
         data: [
                 { y: '2006', a: 100, b: 90 },
                 { y: '2007', a: 75,  b: 65 },
                 { y: '2008', a: 50,  b: 40 },
                 { y: '2009', a: 75,  b: 65 },
                 { y: '2010', a: 50,  b: 40 },
                 { y: '2011', a: 75,  b: 65 },
                 { y: '2012', a: 100, b: 90 }
               ],
        xkey: 'y',
        ykeys: ['a', 'b'],
        labels: ['Series A', 'Series B']
      });
+3


source to share


1 answer


I got started by setting ymin to 100 and ymax to 0. He then plotted my line graph with values ​​closest to 0 at the top and closest to 100 at the bottom. Here is my code snippet.

config = 
{
    data: data,
    xkey: 'y',
    ymin: 100,
    ymax: 0,
    fillOpacity: 0.6,
    ....
}


You can see instructions here: https://morrisjs.github.io/morris.js/lines.html

+3


source






More articles:


All Articles