<!DOCTYPE HTML>
<html>
  <head>
    <title>Vega Chart</title>
    <script src="{{ cdn_url_for('d3.js') }}"></script>
    <script src="{{ cdn_url_for('d3.layout.cloud.js') }}"></script>
    <script src="{{ cdn_url_for('vega.js') }}"></script>
    <script type="text/javascript">
        function parse(spec) {
          vg.parse.spec(spec, function(chart) { chart({el:"#vis"}).update(); });
        };
        parse("{{ url_for("api.api_vega", vega_type=vega_type, uuid=uuid) + '?' + url_args }}");
    </script>
    <style>
      #wrapper {
        width: 100%;
        text-align: center;
      }

      #vis {
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -270px;
        margin-left: -450px;
      }
    </style>
  </head>
  <body>
    <div id="wrapper">
      <div id="vis"></div>
    </div>
  </body>
</html>
