.. _nbjsonrst:

=======================
Show JSON in a notebook
=======================


.. only:: html

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


Displays `JSON <https://en.wikipedia.org/wiki/JSON>`__ in a notebook.

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>`__.

.. code:: ipython3

    from jyquickhelper import JSONJS
    JSONJS(dict(name="xavier", city="Paris"), only_html=True, show_to_level=3)






.. raw:: html

    <div id="1aa654fc-12b3-413d-ae7b-04460cd15c17" style="height: 100%; width:100%;" show_to_level=3></div>
    <script>

            require(["https://rawgit.com/caldwell/renderjson/master/renderjson.js"], function() {
            document.getElementById('1aa654fc-12b3-413d-ae7b-04460cd15c17').appendChild(renderjson({"name": "xavier", "city": "Paris"}))
            }); 
    </script>




.. code:: ipython3

    import requests
    data_json = requests.get("http://api.worldbank.org/countries?incomeLevel=LMC&format=json").json()
    JSONJS(data_json)






.. raw:: html

    <div id="6f785933-867b-4c8e-9623-a5441808950f" style="height: 100%; width:100%;"></div>
    <script>

            require(["https://rawgit.com/caldwell/renderjson/master/renderjson.js"], function() {
            document.getElementById('6f785933-867b-4c8e-9623-a5441808950f').appendChild(renderjson([{"page": 1, "pages": 1, "per_page": "50", "total": 47}, [{"id": "AGO", "iso2Code": "AO", "name": "Angola", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "Luanda", "longitude": "13.242", "latitude": "-8.81155"}, {"id": "BGD", "iso2Code": "BD", "name": "Bangladesh", "region": {"id": "SAS", "value": "South Asia"}, "adminregion": {"id": "SAS", "value": "South Asia"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Dhaka", "longitude": "90.4113", "latitude": "23.7055"}, {"id": "BOL", "iso2Code": "BO", "name": "Bolivia", "region": {"id": "LCN", "value": "Latin America & Caribbean "}, "adminregion": {"id": "LAC", "value": "Latin America & Caribbean (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "La Paz", "longitude": "-66.1936", "latitude": "-13.9908"}, {"id": "BTN", "iso2Code": "BT", "name": "Bhutan", "region": {"id": "SAS", "value": "South Asia"}, "adminregion": {"id": "SAS", "value": "South Asia"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Thimphu", "longitude": "89.6177", "latitude": "27.5768"}, {"id": "CIV", "iso2Code": "CI", "name": "Cote d'Ivoire", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Yamoussoukro", "longitude": "-4.0305", "latitude": "5.332"}, {"id": "CMR", "iso2Code": "CM", "name": "Cameroon", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Yaounde", "longitude": "11.5174", "latitude": "3.8721"}, {"id": "COG", "iso2Code": "CG", "name": "Congo, Rep.", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Brazzaville", "longitude": "15.2662", "latitude": "-4.2767"}, {"id": "COM", "iso2Code": "KM", "name": "Comoros", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Moroni", "longitude": "43.2418", "latitude": "-11.6986"}, {"id": "CPV", "iso2Code": "CV", "name": "Cabo Verde", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Praia", "longitude": "-23.5087", "latitude": "14.9218"}, {"id": "DJI", "iso2Code": "DJ", "name": "Djibouti", "region": {"id": "MEA", "value": "Middle East & North Africa"}, "adminregion": {"id": "MNA", "value": "Middle East & North Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Djibouti", "longitude": "43.1425", "latitude": "11.5806"}, {"id": "EGY", "iso2Code": "EG", "name": "Egypt, Arab Rep.", "region": {"id": "MEA", "value": "Middle East & North Africa"}, "adminregion": {"id": "MNA", "value": "Middle East & North Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "Cairo", "longitude": "31.2461", "latitude": "30.0982"}, {"id": "FSM", "iso2Code": "FM", "name": "Micronesia, Fed. Sts.", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Palikir", "longitude": "158.185", "latitude": "6.91771"}, {"id": "GHA", "iso2Code": "GH", "name": "Ghana", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Accra", "longitude": "-0.20795", "latitude": "5.57045"}, {"id": "HND", "iso2Code": "HN", "name": "Honduras", "region": {"id": "LCN", "value": "Latin America & Caribbean "}, "adminregion": {"id": "LAC", "value": "Latin America & Caribbean (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Tegucigalpa", "longitude": "-87.4667", "latitude": "15.1333"}, {"id": "IDN", "iso2Code": "ID", "name": "Indonesia", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "Jakarta", "longitude": "106.83", "latitude": "-6.19752"}, {"id": "IND", "iso2Code": "IN", "name": "India", "region": {"id": "SAS", "value": "South Asia"}, "adminregion": {"id": "SAS", "value": "South Asia"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "New Delhi", "longitude": "77.225", "latitude": "28.6353"}, {"id": "KEN", "iso2Code": "KE", "name": "Kenya", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Nairobi", "longitude": "36.8126", "latitude": "-1.27975"}, {"id": "KGZ", "iso2Code": "KG", "name": "Kyrgyz Republic", "region": {"id": "ECS", "value": "Europe & Central Asia"}, "adminregion": {"id": "ECA", "value": "Europe & Central Asia (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Bishkek", "longitude": "74.6057", "latitude": "42.8851"}, {"id": "KHM", "iso2Code": "KH", "name": "Cambodia", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Phnom Penh", "longitude": "104.874", "latitude": "11.5556"}, {"id": "KIR", "iso2Code": "KI", "name": "Kiribati", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Tarawa", "longitude": "172.979", "latitude": "1.32905"}, {"id": "LAO", "iso2Code": "LA", "name": "Lao PDR", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Vientiane", "longitude": "102.177", "latitude": "18.5826"}, {"id": "LSO", "iso2Code": "LS", "name": "Lesotho", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Maseru", "longitude": "27.7167", "latitude": "-29.5208"}, {"id": "MAR", "iso2Code": "MA", "name": "Morocco", "region": {"id": "MEA", "value": "Middle East & North Africa"}, "adminregion": {"id": "MNA", "value": "Middle East & North Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "Rabat", "longitude": "-6.8704", "latitude": "33.9905"}, {"id": "MDA", "iso2Code": "MD", "name": "Moldova", "region": {"id": "ECS", "value": "Europe & Central Asia"}, "adminregion": {"id": "ECA", "value": "Europe & Central Asia (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Chisinau", "longitude": "28.8497", "latitude": "47.0167"}, {"id": "MMR", "iso2Code": "MM", "name": "Myanmar", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Naypyidaw", "longitude": "95.9562", "latitude": "21.914"}, {"id": "MNG", "iso2Code": "MN", "name": "Mongolia", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Ulaanbaatar", "longitude": "106.937", "latitude": "47.9129"}, {"id": "MRT", "iso2Code": "MR", "name": "Mauritania", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Nouakchott", "longitude": "-15.9824", "latitude": "18.2367"}, {"id": "NGA", "iso2Code": "NG", "name": "Nigeria", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Abuja", "longitude": "7.48906", "latitude": "9.05804"}, {"id": "NIC", "iso2Code": "NI", "name": "Nicaragua", "region": {"id": "LCN", "value": "Latin America & Caribbean "}, "adminregion": {"id": "LAC", "value": "Latin America & Caribbean (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Managua", "longitude": "-86.2734", "latitude": "12.1475"}, {"id": "PAK", "iso2Code": "PK", "name": "Pakistan", "region": {"id": "SAS", "value": "South Asia"}, "adminregion": {"id": "SAS", "value": "South Asia"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Islamabad", "longitude": "72.8", "latitude": "30.5167"}, {"id": "PHL", "iso2Code": "PH", "name": "Philippines", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "Manila", "longitude": "121.035", "latitude": "14.5515"}, {"id": "PNG", "iso2Code": "PG", "name": "Papua New Guinea", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Port Moresby", "longitude": "147.194", "latitude": "-9.47357"}, {"id": "PSE", "iso2Code": "PS", "name": "West Bank and Gaza", "region": {"id": "MEA", "value": "Middle East & North Africa"}, "adminregion": {"id": "MNA", "value": "Middle East & North Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "LNX", "value": "Not classified"}, "capitalCity": "", "longitude": "", "latitude": ""}, {"id": "SDN", "iso2Code": "SD", "name": "Sudan", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Khartoum", "longitude": "32.5363", "latitude": "15.5932"}, {"id": "SEN", "iso2Code": "SN", "name": "Senegal", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Dakar", "longitude": "-17.4734", "latitude": "14.7247"}, {"id": "SLB", "iso2Code": "SB", "name": "Solomon Islands", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Honiara", "longitude": "159.949", "latitude": "-9.42676"}, {"id": "SLV", "iso2Code": "SV", "name": "El Salvador", "region": {"id": "LCN", "value": "Latin America & Caribbean "}, "adminregion": {"id": "LAC", "value": "Latin America & Caribbean (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "San Salvador", "longitude": "-89.2073", "latitude": "13.7034"}, {"id": "STP", "iso2Code": "ST", "name": "Sao Tome and Principe", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Sao Tome", "longitude": "6.6071", "latitude": "0.20618"}, {"id": "SWZ", "iso2Code": "SZ", "name": "Eswatini", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "Mbabane", "longitude": "31.4659", "latitude": "-26.5225"}, {"id": "TLS", "iso2Code": "TL", "name": "Timor-Leste", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Dili", "longitude": "125.567", "latitude": "-8.56667"}, {"id": "TUN", "iso2Code": "TN", "name": "Tunisia", "region": {"id": "MEA", "value": "Middle East & North Africa"}, "adminregion": {"id": "MNA", "value": "Middle East & North Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "Tunis", "longitude": "10.21", "latitude": "36.7899"}, {"id": "UKR", "iso2Code": "UA", "name": "Ukraine", "region": {"id": "ECS", "value": "Europe & Central Asia"}, "adminregion": {"id": "ECA", "value": "Europe & Central Asia (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "Kiev", "longitude": "30.5038", "latitude": "50.4536"}, {"id": "UZB", "iso2Code": "UZ", "name": "Uzbekistan", "region": {"id": "ECS", "value": "Europe & Central Asia"}, "adminregion": {"id": "ECA", "value": "Europe & Central Asia (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Tashkent", "longitude": "69.269", "latitude": "41.3052"}, {"id": "VNM", "iso2Code": "VN", "name": "Vietnam", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IBD", "value": "IBRD"}, "capitalCity": "Hanoi", "longitude": "105.825", "latitude": "21.0069"}, {"id": "VUT", "iso2Code": "VU", "name": "Vanuatu", "region": {"id": "EAS", "value": "East Asia & Pacific"}, "adminregion": {"id": "EAP", "value": "East Asia & Pacific (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Port-Vila", "longitude": "168.321", "latitude": "-17.7404"}, {"id": "ZMB", "iso2Code": "ZM", "name": "Zambia", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDX", "value": "IDA"}, "capitalCity": "Lusaka", "longitude": "28.2937", "latitude": "-15.3982"}, {"id": "ZWE", "iso2Code": "ZW", "name": "Zimbabwe", "region": {"id": "SSF", "value": "Sub-Saharan Africa "}, "adminregion": {"id": "SSA", "value": "Sub-Saharan Africa (excluding high income)"}, "incomeLevel": {"id": "LMC", "value": "Lower middle income"}, "lendingType": {"id": "IDB", "value": "Blend"}, "capitalCity": "Harare", "longitude": "31.0672", "latitude": "-17.8312"}]]))
            }); 
    </script>