Embed HTML file in page

support
8

I solved it by exporting the bokeh plots to a JSON object and loading these using BokehJS.

I put the JSON file into a resource folder and created this shortcode (bokeh.html):

{{ $item := $.Page.Resources.GetMatch (.Get 0)}}
<div id="{{ .Get 0 }}">
  <script charset="utf-8" type="text/javascript">
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        var item = JSON.parse(this.responseText);
        Bokeh.embed.embed_item(item, "{{ .Get 0 }}");
      }
    };
    xmlhttp.open("GET", "{{ $item.RelPermalink }}", true);
    xmlhttp.send(); 
  </script>
</div>

Which I called from a markdown file with:

{{% bokeh "resources/myplot.json" %}}

Worked like a charm!

1 Like