title: Pygal render SVG in Jupyter Notebooks
body: <p>Im currently using Jupyter Notebooks and I would like to render SVG's via HTML without saving them as a local SVG and display them afterwards.</p>
  
  <p>Im using this code:</p>
  
  <pre><code>%matplotlib inline
  from IPython.display import SVG, HTML
  html_pygal = """
  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
    &lt;script type="text/javascript" src="http://kozea.github.com/pygal.js/javascripts/svg.jquery.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="http://kozea.github.com/pygal.js/javascripts/pygal-tooltips.js"&gt;&lt;/script&gt;
      &lt;!-- ... --&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;figure&gt;
        {pygal_render}
      &lt;/figure&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  """
  
  import pygal
  line_chart = pygal.Line()
  line_chart.title = 'Browser usage evolution (in %)'
  line_chart.x_labels = map(str, range(2002, 2013))
  line_chart.add('Firefox', [None, None,    0, 16.6,   25,   31, 36.4, 45.5, 46.3, 42.8, 37.1])
  line_chart.add('Chrome',  [None, None, None, None, None, None,    0,  3.9, 10.8, 23.8, 35.3])
  line_chart.add('IE',      [85.8, 84.6, 84.7, 74.5,   66, 58.6, 54.7, 44.8, 36.2, 26.6, 20.1])
  line_chart.add('Others',  [14.2, 15.4, 15.3,  8.9,    9, 10.4,  8.9,  5.8,  6.7,  6.8,  7.5])
  HTML(html_pygal.format(pygal_render=line_chart.render()))
  </code></pre>
  
  <p>Here is the problem: While Jupyter manages to render the SVG file it also displays a Javascript error which looks like follows:</p>
  
  <p>b'\n</p>
  
  <p>*SVG picture comes here</p>
  
  <p>'
  Javascript error adding output!
  SyntaxError: illegal character
  See your browser Javascript console for more details.</p>
  
  <p>When checking the browser console this is the error message:</p>
  
  <pre><code>loaded custom.js  2017-04-20_analytics.ipynb:121:15
  Default extension for cell metadata editing loaded.  main.min.js:24261:9
  Raw Cell Format toolbar preset loaded.  main.min.js:24347:5
  Slideshow extension for metadata editing loaded.  main.min.js:24395:9
  actions jupyter-notebook:find-and-replace does not exist, still binding it in case it will be defined later...  main.min.js:29204:17
  load_extensions Arguments { 0: "jupyter-js-widgets/extension", 2 weitere… }  main.min.js:12231:9
  Session: kernel_created (b51341fe-f4d8-42be-a9b8-46ac47476a99)  main.min.js:23547:13
  Starting WebSockets: ws://localhost:8888/api/kernels/1852f19e-52f2-4ce2-91d8-f6276ea95b40  main.min.js:22833:9
  Loading extension: jupyter-js-widgets/extension  main.min.js:12208:21
  Kernel: kernel_connected (1852f19e-52f2-4ce2-91d8-f6276ea95b40)  main.min.js:22480:13
  Kernel: kernel_ready (1852f19e-52f2-4ce2-91d8-f6276ea95b40)  main.min.js:22480:13
  loaded widgets  extension.js:134:14
  Widget backend and frontend versions are compatible  extension.js:32280:22
  SyntaxError: illegal character
  Stack-Trace:
  globalEval@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:87:4231
  domManip@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:88:21389
  append@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:88:18980
  OutputArea.prototype._safe_append@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:20345:13
  OutputArea.prototype.append_execute_result@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:20372:9
  OutputArea.prototype.append_output@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:20218:17
  OutputArea.prototype.handle_output@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:20165:9
  output@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:21820:21
  Kernel.prototype._handle_output_message@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:23440:13
  i@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:87:5486
  Kernel.prototype._handle_iopub_message@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:23467:20
  Kernel.prototype._finish_ws_message@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:23304:24
  Kernel.prototype._handle_ws_message/this._msg_queue&lt;@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:23295:39
    main.min.js:20347:13
  SyntaxError: illegal character
  Stack-Trace:
  globalEval@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:87:4231
  domManip@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:88:21389
  append@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:88:18980
  OutputArea.prototype._safe_append@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:20345:13
  OutputArea.prototype.append_execute_result@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:20372:9
  OutputArea.prototype.append_output@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:20218:17
  OutputArea.prototype.handle_output@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:20165:9
  output@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:21820:21
  Kernel.prototype._handle_output_message@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:23440:13
  i@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:87:5486
  Kernel.prototype._handle_iopub_message@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:23467:20
  Kernel.prototype._finish_ws_message@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:23304:24
  Kernel.prototype._handle_ws_message/this._msg_queue&lt;@http://localhost:8888/static/notebook/js/main.min.js?v=edbc43d9bb99b1be2585a121ed720314:23295:39
  </code></pre>
  
  <p>My Python Version:
  3.6.0
  OS: Windows 7 64 Bit
  Pygal Version: 2.3.1</p>
  
  <p>Note: my current workaround which works but is not the solution which I'm looking for is to create a local SVG and then display it with the library import: <code>from IPython.display import display</code></p>