Example including vega-lite

Example comes from this great blog post right here that was also used in our test import script.

We can use a vegachart HTML tag like so:

<vegachart schema-url="/assets/json/cars.json" style="width: 100%"></vegachart>

In theory, you can also use Jekyll hooks to do it, but I haven’t figured out a way that looks nice yet.

Search The Data & Methods

Below is where we can put some links to both the data and the analysis code as buttons:

<div class="left">
<a class="m-1 btn btn-outline-primary btn-2 " href="https://github.com/vega/vega/blob/main/docs/data/cars.json">
  The Data
</a>
</div>

<div class="right">
<a class="m-1 btn btn-outline-primary btn-2 " href="https://blog.4dcu.be/programming/2021/05/03/Interactive-Visualizations.html">
  The Analysis
</a>
</div>

Making the same plot in many ways with Altair in Python!

example of side by side plot that isn’t interactive

with interactivity now