#!/usr/bin/env python
# -*- coding: utf-8 -*-
# # Notebook, HTML, SVG, Javascript, JSON
#
# Display SVG, JSON in a notebook.
# In[1]:
from jyquickhelper import add_notebook_menu
add_notebook_menu()
# ## HTML
# In[2]:
get_ipython().run_cell_magic('html', '', '\nitalic\n')
# In[3]:
from IPython.display import HTML
HTML("some bold text")
# In[4]:
from IPython.display import HTML, display
display(HTML("some bold text"))
# ## SVG
#
# * [SVG language](http://tutorials.jenkov.com/svg/simple-svg-example.html)
# In[5]:
get_ipython().run_cell_magic('svg', '', '\n\n')
# In[6]:
from IPython.display import SVG
SVG("""""")
# ## Javascript
# ### with magic commands
#
# Usually, the javascript needs a zone in the page where the output will be inserted. That's what the next cell does.
# In[7]:
get_ipython().run_cell_magic('html', '', '\n
\n')
# This cell will populate the zone just above. The rendering is not great when the notebook is converted into RST. Look into the HTML conversion.
# In[8]:
get_ipython().run_cell_magic('javascript', '', '\nvar zone = document.getElementById("myfirstid");\nvar student = new Array();\nstudent[1]=23;\nstudent[2]=34;\nstudent[3]=67;\nstudent[4]=76;\nstudent[5]=51;\nstudent[6]=72;\nzone.innerHTML = "Student results";\nzone.innerHTML += "
";\nvar numStudents=0;\nvar sum=0;\nvar ans=0;\nfor(var i in student){\n zone.innerHTML += "
";
ans=Math.round(sum/numStudents);
zone.innerHTML += "student average is "+ans+"%";
""".replace("myfirstid", str(self.uuid))
display_javascript(js, raw=True)
# In[10]:
MyCustomObject()
# ## JSON
#
# Inspired from [Pretty JSON Formatting in IPython Notebook](http://stackoverflow.com/questions/18873066/pretty-json-formatting-in-ipython-notebook). We use the trick described just above. The only addition is the use of an external library [renderjson](https://github.com/caldwell/renderjson). The code is here : [json_helper.py](https://github.com/sdpython/jyquickhelper/blob/master/src/jyquickhelper/json_helper.py#L11).
# In[11]:
from jyquickhelper import JSONJS
JSONJS(dict(name="xavier", city="Paris", objs=[dict(number=10, street="River")]))
# In[12]: