d3.js学习12

简单的svg

---

 

var width=600,
      height=500;

			var svg = d3.select("body").append("svg");

			svg.attr("height",height)
				.attr("width",width);

			svg.append("line")
				.attr("x1",0)//起始点横坐标
				.attr("y1",200)//起始点纵坐标
				.attr("x2",100)//终结点横坐标
				.attr("y2",100)//终结点纵坐标
				.attr("stroke","black")
				.attr("stroke-width",2);//注意，这里需要设置颜色，默认颜色目测为白色，看不见

			svg.append("circle")
				.attr("cx",200)//圆心横、纵坐标
				.attr("cy",150)
				.attr("r",50);

			svg.append("rect")
				.attr("x",300)//左上角顶点横、纵坐标
				.attr("y",100)
				.attr("width",100)//横向宽度
				.attr("height",100)//纵向高度
				.attr("rx",5);//圆角矩形

			svg.append("polygon")//多边形
				.attr("points","450,200 500,100 550,200")//定义多边形的顶点