example.ipynb

{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Pandas Highcharts Example"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "* Use [Highcharts](http://highcharts.com) to plot [pandas](http://pandas.pydata.org) DataFrame\n",
    "* Code on Github at [pandas-highcharts](https://github.com/gtnx/pandas-highcharts)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Import"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "<script src=\"//code.highcharts.com/stock/highstock.js\"></script>\n",
       "<script src=\"//code.highcharts.com/highcharts-more.js\"></script>\n",
       "<script src=\"//code.highcharts.com/modules/exporting.js\"></script>\n"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "%load_ext autoreload\n",
    "%autoreload 2\n",
    "\n",
    "import pandas as pd\n",
    "import datetime\n",
    "import os\n",
    "import numpy as np\n",
    "from pandas.compat import StringIO\n",
    "from pandas.io.common import urlopen\n",
    "from IPython.display import display, display_pretty, Javascript, HTML\n",
    "from pandas_highcharts.core import serialize\n",
    "from pandas_highcharts.display import display_charts\n",
    "import matplotlib.pyplot as plt\n",
    "\n",
    "# Data retrieved from http://www.quandl.com/api/v1/datasets/ODA/DEU_PCPIPCH.csv?column=1\n",
    "data = \"\"\"Date,Value\\n2019-12-31,1.7\\n2018-12-31,1.7\\n2017-12-31,1.7\\n2016-12-31,1.5\\n2015-12-31,1.247\\n2014-12-31,0.896\\n2013-12-31,1.601\\n2012-12-31,2.13\\n2011-12-31,2.498\\n2010-12-31,1.158\\n2009-12-31,0.226\\n2008-12-31,2.738\\n2007-12-31,2.285\\n2006-12-31,1.784\\n2005-12-31,1.92\\n2004-12-31,1.799\\n2003-12-31,1.022\\n2002-12-31,1.346\\n2001-12-31,1.904\\n2000-12-31,1.418\\n1999-12-31,0.626\\n1998-12-31,0.593\\n1997-12-31,1.542\\n1996-12-31,1.19\\n1995-12-31,1.733\\n1994-12-31,2.717\\n1993-12-31,4.476\\n1992-12-31,5.046\\n1991-12-31,3.474\\n1990-12-31,2.687\\n1989-12-31,2.778\\n1988-12-31,1.274\\n1987-12-31,0.242\\n1986-12-31,-0.125\\n1985-12-31,2.084\\n1984-12-31,2.396\\n1983-12-31,3.284\\n1982-12-31,5.256\\n1981-12-31,6.324\\n1980-12-31,5.447\\n\"\"\"\n",
    "df = pd.read_csv(StringIO(data), index_col=0, parse_dates=True)\n",
    "df = df.sort_index()"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Basic examples"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 2,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<div id=\"chart_idwevHOdPn\"</div>\n",
       "    <script type=\"text/javascript\">new Highcharts.Chart({\"title\":{\"text\":\"Germany inflation rate\"},\"series\":[{\"data\":[[347068800000,5.447],[378604800000,6.324],[410140800000,5.256],[441676800000,3.284],[473299200000,2.396],[504835200000,2.084],[536371200000,-0.125],[567907200000,0.242],[599529600000,1.274],[631065600000,2.778],[662601600000,2.687],[694137600000,3.474],[725760000000,5.046],[757296000000,4.476],[788832000000,2.717],[820368000000,1.733],[851990400000,1.19],[883526400000,1.542],[915062400000,0.593],[946598400000,0.626],[978220800000,1.418],[1009756800000,1.904],[1041292800000,1.346],[1072828800000,1.022],[1104451200000,1.799],[1135987200000,1.92],[1167523200000,1.784],[1199059200000,2.285],[1230681600000,2.738],[1262217600000,0.226],[1293753600000,1.158],[1325289600000,2.498],[1356912000000,2.13],[1388448000000,1.601],[1419984000000,0.896],[1451520000000,1.247],[1483142400000,1.5],[1514678400000,1.7],[1546214400000,1.7],[1577750400000,1.7]],\"name\":\"Value\",\"yAxis\":0}],\"yAxis\":[{}],\"chart\":{\"renderTo\":\"chart_idwevHOdPn\"},\"xAxis\":{\"type\":\"datetime\",\"title\":{\"text\":\"Date\"}},\"legend\":{\"enabled\":true}});</script>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "display_charts(df, title=\"Germany inflation rate\")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<div id=\"chart_idLtGMsCiR\"</div>\n",
       "    <script type=\"text/javascript\">new Highcharts.StockChart({\"title\":{\"text\":\"Germany inflation rate\"},\"series\":[{\"data\":[[347068800000,5.447],[378604800000,6.324],[410140800000,5.256],[441676800000,3.284],[473299200000,2.396],[504835200000,2.084],[536371200000,-0.125],[567907200000,0.242],[599529600000,1.274],[631065600000,2.778],[662601600000,2.687],[694137600000,3.474],[725760000000,5.046],[757296000000,4.476],[788832000000,2.717],[820368000000,1.733],[851990400000,1.19],[883526400000,1.542],[915062400000,0.593],[946598400000,0.626],[978220800000,1.418],[1009756800000,1.904],[1041292800000,1.346],[1072828800000,1.022],[1104451200000,1.799],[1135987200000,1.92],[1167523200000,1.784],[1199059200000,2.285],[1230681600000,2.738],[1262217600000,0.226],[1293753600000,1.158],[1325289600000,2.498],[1356912000000,2.13],[1388448000000,1.601],[1419984000000,0.896],[1451520000000,1.247],[1483142400000,1.5],[1514678400000,1.7],[1546214400000,1.7],[1577750400000,1.7]],\"name\":\"Value\",\"yAxis\":0}],\"yAxis\":[{}],\"chart\":{\"renderTo\":\"chart_idLtGMsCiR\"},\"xAxis\":{\"type\":\"datetime\",\"title\":{\"text\":\"Date\"}},\"legend\":{\"enabled\":true}});</script>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "display_charts(df, chart_type=\"stock\", title=\"Germany inflation rate\")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<div id=\"chart_idPfrVlNHy\"</div>\n",
       "    <script type=\"text/javascript\">new Highcharts.Chart({\"title\":{\"text\":\"Germany inflation rate\"},\"series\":[{\"data\":[[347068800000,5.447],[378604800000,6.324],[410140800000,5.256],[441676800000,3.284],[473299200000,2.396],[504835200000,2.084],[536371200000,-0.125],[567907200000,0.242],[599529600000,1.274],[631065600000,2.778],[662601600000,2.687],[694137600000,3.474],[725760000000,5.046],[757296000000,4.476],[788832000000,2.717],[820368000000,1.733],[851990400000,1.19],[883526400000,1.542],[915062400000,0.593],[946598400000,0.626],[978220800000,1.418],[1009756800000,1.904],[1041292800000,1.346],[1072828800000,1.022],[1104451200000,1.799],[1135987200000,1.92],[1167523200000,1.784],[1199059200000,2.285],[1230681600000,2.738],[1262217600000,0.226],[1293753600000,1.158],[1325289600000,2.498],[1356912000000,2.13],[1388448000000,1.601],[1419984000000,0.896],[1451520000000,1.247],[1483142400000,1.5],[1514678400000,1.7],[1546214400000,1.7],[1577750400000,1.7]],\"name\":\"Value\",\"yAxis\":0}],\"yAxis\":[{}],\"chart\":{\"renderTo\":\"chart_idPfrVlNHy\",\"type\":\"column\"},\"xAxis\":{\"type\":\"datetime\",\"title\":{\"text\":\"Date\"}},\"legend\":{\"enabled\":true}});</script>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "display_charts(df, kind=\"bar\", title=\"Germany inflation rate\")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<div id=\"chart_idhtBjFEwH\"</div>\n",
       "    <script type=\"text/javascript\">new Highcharts.Chart({\"title\":{\"text\":\"Germany inflation rate\"},\"series\":[{\"data\":[[347068800000,5.447],[378604800000,6.324],[410140800000,5.256],[441676800000,3.284],[473299200000,2.396],[504835200000,2.084],[536371200000,-0.125],[567907200000,0.242],[599529600000,1.274],[631065600000,2.778],[662601600000,2.687],[694137600000,3.474],[725760000000,5.046],[757296000000,4.476],[788832000000,2.717],[820368000000,1.733],[851990400000,1.19],[883526400000,1.542],[915062400000,0.593],[946598400000,0.626],[978220800000,1.418],[1009756800000,1.904],[1041292800000,1.346],[1072828800000,1.022],[1104451200000,1.799],[1135987200000,1.92],[1167523200000,1.784],[1199059200000,2.285],[1230681600000,2.738],[1262217600000,0.226],[1293753600000,1.158],[1325289600000,2.498],[1356912000000,2.13],[1388448000000,1.601],[1419984000000,0.896],[1451520000000,1.247],[1483142400000,1.5],[1514678400000,1.7],[1546214400000,1.7],[1577750400000,1.7]],\"name\":\"Value\",\"yAxis\":0}],\"yAxis\":[{}],\"chart\":{\"renderTo\":\"chart_idhtBjFEwH\",\"type\":\"bar\"},\"xAxis\":{\"type\":\"datetime\",\"title\":{\"text\":\"Date\"}},\"legend\":{\"enabled\":true}});</script>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "display_charts(df, kind=\"barh\", title=\"Germany inflation rate\")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<div id=\"chart_idcBqZSxSG\"</div>\n",
       "    <script type=\"text/javascript\">new Highcharts.Chart({\"title\":{\"text\":\"Germany inflation rate\"},\"series\":[{\"data\":[[347068800000,5.447],[378604800000,6.324],[410140800000,5.256],[441676800000,3.284],[473299200000,2.396],[504835200000,2.084],[536371200000,-0.125],[567907200000,0.242],[599529600000,1.274],[631065600000,2.778],[662601600000,2.687],[694137600000,3.474],[725760000000,5.046],[757296000000,4.476],[788832000000,2.717],[820368000000,1.733],[851990400000,1.19],[883526400000,1.542],[915062400000,0.593],[946598400000,0.626],[978220800000,1.418],[1009756800000,1.904],[1041292800000,1.346],[1072828800000,1.022],[1104451200000,1.799],[1135987200000,1.92],[1167523200000,1.784],[1199059200000,2.285],[1230681600000,2.738],[1262217600000,0.226],[1293753600000,1.158],[1325289600000,2.498],[1356912000000,2.13],[1388448000000,1.601],[1419984000000,0.896],[1451520000000,1.247],[1483142400000,1.5],[1514678400000,1.7],[1546214400000,1.7],[1577750400000,1.7]],\"name\":\"Value\",\"yAxis\":0}],\"yAxis\":[{}],\"chart\":{\"width\":400,\"renderTo\":\"chart_idcBqZSxSG\",\"type\":\"column\",\"height\":200},\"xAxis\":{\"type\":\"datetime\",\"title\":{\"text\":\"Date\"}},\"legend\":{\"enabled\":null}});</script>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "display_charts(df, title=\"Germany inflation rate\", legend=None, kind=\"bar\", figsize = (400, 200))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 7,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<div id=\"chart5\"</div>\n",
       "    <script type=\"text/javascript\">new Highcharts.Chart({\"title\":{\"text\":\"Germany inflation rate\"},\"series\":[{\"data\":[[347068800000,5.447],[378604800000,6.324],[410140800000,5.256],[441676800000,3.284],[473299200000,2.396],[504835200000,2.084],[536371200000,-0.125],[567907200000,0.242],[599529600000,1.274],[631065600000,2.778],[662601600000,2.687],[694137600000,3.474],[725760000000,5.046],[757296000000,4.476],[788832000000,2.717],[820368000000,1.733],[851990400000,1.19],[883526400000,1.542],[915062400000,0.593],[946598400000,0.626],[978220800000,1.418],[1009756800000,1.904],[1041292800000,1.346],[1072828800000,1.022],[1104451200000,1.799],[1135987200000,1.92],[1167523200000,1.784],[1199059200000,2.285],[1230681600000,2.738],[1262217600000,0.226],[1293753600000,1.158],[1325289600000,2.498],[1356912000000,2.13],[1388448000000,1.601],[1419984000000,0.896],[1451520000000,1.247],[1483142400000,1.5],[1514678400000,1.7],[1546214400000,1.7],[1577750400000,1.7]],\"name\":\"Value\",\"yAxis\":0}],\"yAxis\":[{}],\"chart\":{\"zoomType\":\"xy\",\"renderTo\":\"chart5\",\"type\":\"column\"},\"xAxis\":{\"type\":\"datetime\",\"title\":{\"text\":\"Date\"}},\"legend\":{\"enabled\":true}});</script>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "display_charts(df, title=\"Germany inflation rate\", kind=\"bar\", render_to=\"chart5\", zoom=\"xy\")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 8,
   "metadata": {
    "collapsed": false
   },
   "outputs": [],
   "source": [
    "# Data retrieved from https://www.quandl.com/api/v1/datasets/CVR/ANGEL_SECTORS.csv\n",
    "data = \"\"\"Year,Software,Healthcare,Hardware,Biotech,Telecom,Manufacturing,Financial Products and Services,IT Services,Industrial/Energy,Retail,Media\\n2013-12-31,23.0,14.0,,11.0,,,7.0,,,7.0,16.0\\n2012-12-31,23.0,14.0,,11.0,,,,,7.0,12.0,7.0\\n2011-12-31,23.0,19.0,,13.0,,,,7.0,13.0,,5.0\\n2010-12-31,16.0,30.0,,15.0,,,,5.0,8.0,5.0,\\n2009-12-31,19.0,17.0,,8.0,,,5.0,,17.0,9.0,\\n2008-12-31,13.0,16.0,,11.0,,,,,8.0,12.0,7.0\\n2007-12-31,27.0,19.0,,12.0,,,,,8.0,6.0,5.0\\n2006-12-31,18.0,21.0,,18.0,,,6.0,,6.0,8.0,\\n2005-12-31,18.0,20.0,8.0,12.0,,,,6.0,6.0,,6.0\\n2004-12-31,22.0,16.0,10.0,10.0,6.0,,8.0,8.0,,7.0,\\n2003-12-31,26.0,13.0,12.0,11.0,5.0,12.0,,,,,\\n2002-12-31,40.0,14.0,5.0,5.0,5.0,,,,,,\\n\"\"\"\n",
    "df3 = pd.read_csv(StringIO(data), index_col=0, parse_dates=True)\n",
    "df3 = df3.fillna(0) / 100\n",
    "df4 = pd.DataFrame(df3.mean(), columns=['ratio'])\n",
    "df4['total'] = 1"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 9,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<div id=\"chart_idIfRWDTBs\"</div>\n",
       "    <script type=\"text/javascript\">new Highcharts.Chart({\"title\":{\"text\":\"Angel Deals By Sector\"},\"series\":[{\"data\":[[\"Software\",0.2233333333],[\"Healthcare\",0.1775],[\"Hardware\",0.0291666667],[\"Biotech\",0.1141666667],[\"Telecom\",0.0133333333],[\"Manufacturing\",0.01],[\"Financial Products and Services\",0.0216666667],[\"IT Services\",0.0216666667],[\"Industrial\\/Energy\",0.0608333333],[\"Retail\",0.055],[\"Media\",0.0383333333]],\"name\":\"ratio\",\"yAxis\":0}],\"yAxis\":[{}],\"chart\":{\"renderTo\":\"chart_idIfRWDTBs\",\"type\":\"pie\"},\"tooltip\":{\"pointFormat\":\"{series.name}: <b>{point.percentage:.1f}%<\\/b>\"},\"xAxis\":{\"categories\":[\"Software\",\"Healthcare\",\"Hardware\",\"Biotech\",\"Telecom\",\"Manufacturing\",\"Financial Products and Services\",\"IT Services\",\"Industrial\\/Energy\",\"Retail\",\"Media\"]},\"legend\":{\"enabled\":true}});</script>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "display_charts(df4, kind='pie', y=['ratio'], title='Angel Deals By Sector', tooltip={'pointFormat': '{series.name}: <b>{point.percentage:.1f}%</b>'})"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Highcharts specific"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 10,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "text/html": [
       "<div id=\"chart_idppnkgFYw\"</div>\n",
       "    <script type=\"text/javascript\">new Highcharts.Chart({\"title\":{\"text\":\"Angel Deals By Sector\"},\"series\":[{\"data\":[2.68,2.13,0.35,1.37,0.16,0.12,0.26,0.26,0.73,0.66,0.46],\"name\":\"sum\",\"yAxis\":0}],\"yAxis\":[{\"max\":2.3,\"min\":0}],\"chart\":{\"polar\":true,\"renderTo\":\"chart_idppnkgFYw\",\"type\":\"column\"},\"xAxis\":{\"categories\":[\"Software\",\"Healthcare\",\"Hardware\",\"Biotech\",\"Telecom\",\"Manufacturing\",\"Financial Products and Services\",\"IT Services\",\"Industrial\\/Energy\",\"Retail\",\"Media\"]},\"legend\":{\"enabled\":true}});</script>"
      ],
      "text/plain": [
       "<IPython.core.display.HTML object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "df4 = pd.DataFrame(df3.sum(), columns=['sum'])\n",
    "#df4.to_dict('series').items()[0][1].tolist()\n",
    "display_charts(df4, polar=True, kind='bar', ylim=(0, 2.3), title='Angel Deals By Sector')"
   ]
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 2",
   "language": "python",
   "name": "python2"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 2
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython2",
   "version": "2.7.10"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 0
}