d3可视化不出现

时间:2017-08-25 17:29:47

标签: d3.js

我正在努力让一个非常基本的d3可视化工作,但我得到的只是一个空白的浏览器窗口。

这是我的index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <script src="https://d3js.org/d3.v4.min.js"></script>
    <script src="code.js"></script>
    <title>My Title</title>
  </head>
  <body>
    <div class="container"></div>
  </body>
</html>

这是我的code.js

console.log("test");

d3.select("body").append("h1").html("Here are some words")

我的控制台打印test。但浏览器窗口中没有任何内容。当我inspect element时,没有添加任何内容。

我尝试通过python -m SimpleHTTPServernpm install -g http-server以及http-server &加载localhost页面。

出了什么问题?

1 个答案:

答案 0 :(得分:3)

您需要更改以下代码的HTML代码:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <script src="https://d3js.org/d3.v4.min.js"></script>    
    <title>My Title</title>
  </head>
  <body>
       <div class="container"></div>
       <script type="text/javascript" src="code.js"></script>
 </body>
</html>

我只是把引用&#34; code.js&#34;的行。在正文标记内