Probably missing something simple but. test.html <div class="hig

I think this might be due to your executing before the body is rendered. Also,

Example causes typeError about d3.compose HOT 2 CLOSED

csnw commented on July 30, 2024

Example causes typeError

from d3.compose.

Comments (2)

john-clarke commented on July 30, 2024

I think this might be due to your script executing before the body is rendered. Also, you'll need to set the charset to utf-8 for d3.js. The following works for me (paths modified slightly):

<html>
  <head>
    <meta charset="utf-8">
    <link type="text/css" href="dist/d3.compose.css"rel="stylesheet" >
    <script type="text/javascript" src="dist/d3.js"></script>
    <script type="text/javascript" src="dist/d3.chart.js"></script>
    <script type="text/javascript" src="dist/d3.compose-all.js"></script>
    <script>
    function main() {
      var data = [
          {x: 1, y: 100,},
          {x: 2, y: 200,},
          {x: 3, y: 150,}
      ];

      var chart = d3.select('#chart').chart('Compose', function(data){
          var charts = [
              d3c.lines('results', {data: data})
          ];
          return [
              d3c.layered(charts)
          ];
      });
      chart.draw(data);
    }
    </script>
  </head>
  <body onload="main()">
    <h1>Competed Count</h1>
    <div id="chart"></div>
  </body>
</html>