# 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繪制一個上面的矩形。
