0

I want to append an svg image in a html document using d3.js but I don't know why it is not working.

Here's what I wrote in my hello.js: 

const w = 600;
const h = 600;
let dataset = [];
let x;
let y;
//Creating SVG Element
let svg =  d3.select("body").append("svg").attr("width", 
w).attr("height", h);

index.html

<html>
<head>
    <meta charset="utf-8">
    <title>Hello, D3</title>
    <script type="text/javascript" src="js/d3/d3.js"></script>
        <script type="text/javascript" src="js/hello.js"></script>


</head>
<body>
</body>
</html>

When I view the source code of my page, I can see that the svg was not created.

I'm using simpleHTTPServer to create a local server and then load my page so I don't think that the browser blocked the script.

EDIT: here's what I see when I inspect the page inspect page

Gyun
  • 13
  • 5
  • What do you see when you inspect the page? The source code is not altered by d3, d3 forms part of the page. – Andrew Reid May 12 '18 at 17:42
  • @AndrewReid I just edited my post. I added a screenshot of what I see when I inspect page – Gyun May 12 '18 at 17:57
  • 2
    @Gyun When your code in `js/hello.js` is executed your `` element is not yet available. Hence, there is nothing to append your `` element to. Have a look at [*"Where should I put – altocumulus May 12 '18 at 19:02

0 Answers0