【D3.js数据可视化系列教程】--（二）最简单的开始：添加元素

1. 添加元素语法：

[selection].append("p");

2. 怎么做？

将D3.js解压到桌面，同时在桌面创建一个index.html

<html>
    <head>
       <meta charset="utf-8">
       <title>D3测试</title>
       <script type="text/javascript" src="d3.js"></script>
    </head>
    <body>
    <script type="text/javascript">
        d3.select("body").append("p").text("New paragraph!");     
    </script>
    </body>
</html>

3. 效果：

添加段落元素

4. 代码解释：

引用D3所在路径

<script type="text/javascript" src="d3.js"></SCRIPT>

选择body标签，为之添加一个p标签，并设置它的内容为New paragraph！

d3.select("body").append("p").text("New paragraph!");

你可以将链接选择换行，这样代码结构更清晰

d3.select("body")
    .append("p")
    .text("New paragraph!");

当然，也可以避免使用链接语法：

var body = d3.select("body");
var p = body.append("p");
p.text("New paragraph!");

以后，你也可以把这些页面和JS部署到你自己的服务器中。我们之后的示例都将部署到服务器，并使用Chrome浏览器演示！！