Simple D3.js example not working

I have this in my index.html file, but it doesn’t display the paragraph that I want to add using D3

 <!DOCTYPE html> <html> <head> <title> D3 page template </title> <script type="text/javascript" src = "d3/d3.v3.js"></script> </head> <body> <script type="text/javascript"> d3.select("body").append("p").text("new paragraph!"); </script> </body> </html> 

The path to where I refer to D3.js should be correct, because if I do a check item in the browser, I can click on the D3 link and it will lead me to the source code.

enter image description here

+6
source share
2 answers

You are missing the character set on your HTML page. Add something like this:

 <meta charset="utf-8"> 

The non-minified D3 source contains the actual character for pi, which confuses the browser if the character set is not defined.

+15
source

I am going to assume that you are testing this without a web server. If so, then your url will read the file: // .... not http: // ..

In this case, the Javascript request will be sent to the file: ///.../D3/d3/d3.v3.js, which will not have a proper set of response headers, for example, charset and MIME.

You can always get it from the CDN to avoid this problem:

 <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> 
+5
source

Source: https://habr.com/ru/post/945498/


All Articles