弦表图

弦生成器

    //     弧生成器
    //     属性名称可以自定义然后设置访问器规范即可
    //     该表图是由两条弧线生成
    //     开始弧 和 结束弧 都是由两个PI的顶点生成  radius是半径
    var dataSet = {
        source: {
            start: 0,
            end: Math.PI * .8,
            radius: 100
        },
        target: {
            start: Math.PI,
            end: Math.PI * 1.2,
            radius: 100
        }
    };
    var svg = d3.select("body").append("svg").attr("width", 500).attr("height", 500);
    var chord = d3.svg.chord().startAngle(function (d) {
        return d.start;
    }).endAngle(function (d) {
        return d.end;
    });
    svg.append("path").attr("d", chord(dataSet)).attr("fill", "purple").attr("transform", "translate(200,200)").attr("stroke", "black")

结果:

弦图表