static/circular_test.html

<!DOCTYPE html>
<html><head>
<link rel="stylesheet" href="/circular-viewer.css">
<script src="/lib/d3.v7.9.0.min.js"></script>
</head><body>
<div id="plot" style="width:700px"></div>
<script type="module">
  import { createCircularView } from "/circular_genome_viewer.js";
  const view = createCircularView(document.getElementById("plot"));
  view.renderGenome({
    genomeSize: 5000,
    genes: [
      {id: "g1", start: 1, end: 900, strand: "+", hoverData: {order: 1}},
      {id: "g2", start: 1000, end: 2200, strand: "-", hoverData: {order: 2}},
      {id: "g3", start: 2400, end: 4900, strand: "+", hoverData: {order: 3}},
    ],
  }, null);
  window.__ok = true;
</script>
</body></html>