.. _nbmorrisrst:

========================================
Javascript library in a notebook: morris
========================================


.. only:: html

    **Links:** :download:`notebook <nb_morris.ipynb>`, :downloadlink:`html <nb_morris2html.html>`, :download:`PDF <nb_morris.pdf>`, :download:`python <nb_morris.py>`, :downloadlink:`slides <nb_morris.slides.html>`, :githublink:`GitHub|_doc/notebooks/nb_morris.ipynb|*`


We try to use the library
`morris.js <http://morrisjs.github.io/morris.js/>`__, we try to
replicate the example from the page
`getting-started <http://morrisjs.github.io/morris.js/#getting-started>`__.
Unfortunately, there are somme issues with
`raphael.js <https://github.com/DmitryBaranovskiy/raphael/>`__, see:


-  `raphael breaks if loaded via
   require-js <https://github.com/DmitryBaranovskiy/raphael/issues/524>`__
-  `raphael-loader <https://github.com/papakpmartin/raphael-loader>`__

So I reused one version of Raphael which seemed to work well in a
previous talk:
`treant-je <http://www.xavierdupre.fr/app/jupytalk/helpsphinx/notebooks/jsonly_treant.html>`__.

.. code:: 

    libs = ["http://fperucic.github.io/treant-js/vendor/raphael.js",
            "http://code.jquery.com/jquery-1.8.2.min.js",
            "https://cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js"]
    
    css = ["https://cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css"]
    
    script = """
    Morris.Line({
      element: '__ID__',
      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']
    });
    """

.. code:: 

    from jyquickhelper import RenderJS
    try:
        r = RenderJS(script=script, css=css, libs=libs)
    except Exception as e:
        print(e)
        r = None
    r


.. parsed-literal::
    Url not found: returned code=403 for 'https://cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css'


The library is nice but it does not play very nice when the notebook is
converted into RST. It works better when it is converted into HTML.