chapter-2 d3 svg shape
style()
设置样式
d3.select('body')
.append('p')
.style('color','red')
.text("Hi,what's up?");
创建画布
var canvas = d3.select('body')
.append('svg')
.attr('width',500)
.attr('height',500);
节点属性
属性列表

circle 属性
cx 相对父级的横向偏移量
cx 相对父级的纵向偏移量
r 半径
fill 填充颜色
var circle = canvas.append('circle')
.attr('cx',250)
.attr('cy',250)
.attr('r',50)
.attr('fill','red')
rectangle 属性
width: 矩形宽度 (也可用于svg 画布)
height: 矩形高度
var rect = canvas.append('rect')
.attr('width',100)
.attr('height',50);
line 属性
x1 , y1 ,x2, y2 线的起点和终点
stroke: 线条颜色
stroke-width: 线条宽度
var line = canvas.append('line')
.attr('x1',0)
.attr('y1',10)
.attr('x2',200)
.attr('y2',200)
.attr('stroke','green')
.attr('stroke-width',1)
Last updated