index.html
<html>
<head>
<title>Hledger charts</title>
<meta charset="utf-8">
<script src="https://cdn.jsdelivr.net/npm/vega@5.21.0"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-lite@5.2.0"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-embed@6.20.2"></script>
<style>
.halfchart { float: left; width: 50%; height: 50%; }
.fullchart { float: left; width: 100%; height: 50%; }
</style>
</head>
<body>
<div class="halfchart" id="vis0"></div>
<div class="halfchart" id="vis1"></div>
<div class="halfchart" id="vis2"></div>
<div class="halfchart" id="vis3"></div>
<div class="fullchart" id="vis4"></div>
<div id="vis5"></div>
<script type="text/javascript">
vegaEmbed('#vis0', "charts/incomestatement.json");
vegaEmbed('#vis1', "charts/savings.json");
vegaEmbed('#vis2', "charts/netliquid.json");
vegaEmbed('#vis3', "charts/netposition.json");
vegaEmbed('#vis4', "charts/wealth.json");
vegaEmbed('#vis5', "charts/expensecategories.json");
</script>
</body>
</html>