add vega-lite embed

This commit is contained in:
Oleh Omelchenko
2024-07-26 03:00:09 +03:00
parent c2500516cb
commit c411fded70
2 changed files with 20 additions and 0 deletions

View File

@@ -12,4 +12,15 @@
g.async = true; g.src = u + 'matomo.js'; s.parentNode.insertBefore(g, s);
})();
</script>
{{ if .Params.load_vega }}
<script src="https://cdn.jsdelivr.net/npm/vega@5"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-lite@5"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-embed@6"></script>
{{ end }}
<style>
.vega-embed {
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1), 0 6px 20px rgba(0, 0, 0, 0.19);
margin: 10px;
}
</style>
<!-- End Matomo Code -->

View File

@@ -0,0 +1,9 @@
<!-- Create a unique ID for the div where the Vega-Lite visualization will be rendered -->
<div class="vegaVis" id="{{ .Get "id" | default "vega-lite-vis" }}"></div>
<script>
const spec = {{ .Inner | safeJS }};
spec['width'] = {{ .Get "width" | default 700}};
spec['height'] = {{ .Get "height" | default 300}};
vegaEmbed('#{{ .Get "id" | default "vega-lite-vis" }}', spec, {"actions": false}).catch(console.error);
</script>