# d3绘制简单形状
基础html模板
``` html
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<div id="root">
</div>
</body>
</html>
```
## 绘制基础图形
``` javascript
var root = d3.select('#root')
.append('svg')
.attr('width',300)
.attr('height',300)
//绘制矩形
function drawRect(){
root.append('rect')
.attr('x',100)
.attr('y',100)
.attr('width',100)
.attr('height',100)
.attr('fill','#333')
}
//绘制线
function drawLine(){
root.append('rect')
.attr('x1',50)
.attr('y1',100)
.attr('x2',50)
.attr('y2',100)
.attr('fill','#333')
}
drawRect()
drawLine()
```
尝试：试着使用path绘制一个上面的矩形。
