中国传媒大学-数据可视化2020-6-D3布局环图玫瑰图鼠标交互20200415.pptxVIP

D3 布局饼图环图玫瑰图李春芳中国传媒大学 计算机与网络空间安全学院目录布局路径饼图环图玫瑰图传媒应用鼠标交互布局：layoutPath：路径SVG中path 标签用来定义路径下面的命令可用于路径数据：M = movetoL = linetoH = horizontal linetoV = vertical linetoC = curvetoS = smooth curvetoQ = quadratic Belzier curveT = smooth quadratic Belzier curvetoA = elliptical ArcZ = closepathPath：路径svg width=100% height=100% version=1.1xmlns=/2000/svgpath d=M250 150 L150 350 L350 350 Z //svg圆弧绘制var dataset = { startAngle: 0 , endAngle: Math.PI * 0.75 };//创建一个弧生成器var arcPath = d3.svg.arc() .innerRadius(50) .outerRadius(100);//添加路径svg.append(path) .attr(d,arcPath(dataset)) .attr(transform,translate(2