Append SVG canvas to element other than body using D3

Question

Is it possible to append an SVG canvas to an element other than <body> using D3.js if the script is not inside that element?

For example, the code below does not work:

<html>
<body>
<script src="../../d3.v2.js"></script>
<script>
    var vis = d3.select("#container")
        .append("svg:svg")
          .attr("width",w)
          .attr("height",h);
</script>

<div id="container"></div>

</body>

All examples I have seen use d3.select("body").append.... but clearly we don't always want to append the canvas immediately to the body.

I found that if the <script> is inside the container div then I can use d3.select("#container") but it seems strange to me that I would have to include my script inside of the specific container(s) where I want the canvas.

Answer 1

You're trying to select #container before it exists. You'll need to put your code in an onload or move the script below #container in the page.

Append SVG canvas to element other than body using D3

Question

1 answers

solution1
21 ACCPTED 2012-12-13 17:57:51

Append SVG canvas to element other than body using D3

Question

1 answers

solution1 21 ACCPTED 2012-12-13 17:57:51

solution1
21 ACCPTED 2012-12-13 17:57:51