Return the Content into a String Using `to_html()` and `to_svg()`¶

In [1]:

import numpy as np
import io
from IPython import display
from lets_plot import *

In [2]:

LetsPlot.setup_html()

In [3]:

p = ggplot() + geom_point(x=0, y=0)

In [4]:

svg = p.to_svg()
svg[:500] + '...'

Out[4]:

'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="plt-container" width="600.0" height="400.0">\n  <style type="text/css">\n  .plt-container {\n   font-family: Lucida Grande, sans-serif;\n   user-select: none;\n   -webkit-user-select: none;\n   -moz-user-select: none;\n   -ms-user-select: none;\n}\ntext {\n   text-rendering: optimizeLegibility;\n}\n#ps675Gy .plot-title {\n   fill: #474747;\n   font-family: Lucida Grande, sans-serif;\n   font-size: 16.0px;\n   font-weight: ...'

In [5]:

display.SVG(svg)

Out[5]:

In [6]:

html = p.to_html()
html

Out[6]:

'<html lang="en">\n   <head>\n       <meta charset="UTF-8">\n       <script type="text/javascript" data-lets-plot-script="library" src="http://127.0.0.1:8080/js-package/build/dist/js/developmentExecutable/lets-plot.js"></script>\n   </head>\n   <body>\n          <div id="fKY5st"></div>\n   <script type="text/javascript" data-lets-plot-script="plot">\n       var plotSpec={\n"mapping":{\n},\n"data_meta":{\n},\n"kind":"plot",\n"scales":[],\n"layers":[{\n"geom":"point",\n"mapping":{\n},\n"data_meta":{\n},\n"x":0.0,\n"y":0.0,\n"data":{\n}\n}],\n"metainfo_list":[]\n};\n       var plotContainer = document.getElementById("fKY5st");\n       LetsPlot.buildPlotFromProcessedSpecs(plotSpec, -1, -1, plotContainer);\n   </script>\n   </body>\n</html>'

In [7]:

p.to_html(iframe=True)

Out[7]:

'            <iframe src=\'about:blank\' style=\'border:none !important;\' width=\'600\' height=\'400\' srcdoc="&lt;html lang=&quot;en&quot;>\n   &lt;head>\n       &lt;meta charset=&quot;UTF-8&quot;>\n       &lt;style> html, body { margin: 0; overflow: hidden; } &lt;/style>\n       &lt;script type=&quot;text/javascript&quot; data-lets-plot-script=&quot;library&quot; src=&quot;http://127.0.0.1:8080/js-package/build/dist/js/developmentExecutable/lets-plot.js&quot;>&lt;/script>\n   &lt;/head>\n   &lt;body>\n          &lt;div id=&quot;jLR78Q&quot;>&lt;/div>\n   &lt;script type=&quot;text/javascript&quot; data-lets-plot-script=&quot;plot&quot;>\n       var plotSpec={\n&quot;mapping&quot;:{\n},\n&quot;data_meta&quot;:{\n},\n&quot;kind&quot;:&quot;plot&quot;,\n&quot;scales&quot;:[],\n&quot;layers&quot;:[{\n&quot;geom&quot;:&quot;point&quot;,\n&quot;mapping&quot;:{\n},\n&quot;data_meta&quot;:{\n},\n&quot;x&quot;:0.0,\n&quot;y&quot;:0.0,\n&quot;data&quot;:{\n}\n}],\n&quot;metainfo_list&quot;:[]\n};\n       var plotContainer = document.getElementById(&quot;jLR78Q&quot;);\n       LetsPlot.buildPlotFromProcessedSpecs(plotSpec, -1, -1, plotContainer);\n   &lt;/script>\n   &lt;/body>\n&lt;/html>"></iframe>    '

In [8]:

display.HTML(html)

Out[8]:

In [9]:

ggsave(p, 'hist_plot.html')

Out[9]:

'D:\\Projects\\lets-plot-master\\lets-plot-1067\\docs\\dev\\notebooks\\lets-plot-images\\hist_plot.html'

In [10]:

data = {'x': np.random.normal(size=100),
        'y': np.random.normal(size=100)}
grid = gggrid([
    ggplot() + geom_point(x=0, y=0),
    ggplot() + geom_point(x=1.0, y=1.0)
])
html = grid.to_html()

In [11]:

display.HTML(html)

Out[11]:

In [12]:

grid.to_svg()[:500] + '...'

Out[12]:

'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="plt-container" width="900.0" height="400.0">\n  <g id="pnoDSHf">\n    <rect x="0.0" y="0.0" height="400.0" width="900.0" fill="rgb(255,255,255)" fill-opacity="1.0" stroke="rgb(71,71,71)" stroke-opacity="1.0" stroke-width="0.0">\n    </rect>\n  </g>\n  <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="plt-container" width="448.0" height="400.0" x="0.0" y="0.0">\n    <style t...'

Return the Content into a String Using to_html() and to_svg()¶

Return the Content into a String Using `to_html()` and `to_svg()`¶