Javascript 如何实现D3饼图的点击功能

Javascript 如何实现D3饼图的点击功能,javascript,d3.js,charts,Javascript,D3.js,Charts,我正在使用此链接中的示例绘制饼图: 我对原始代码做了两次修改: 1只允许有三个弧 function update() { arraySize = 3;// it is total number of sectors streakerDataAdded = d3.range(arraySize).map(fillArray); // value is fed into streakerDataAdded oldPieData =

我正在使用此链接中的示例绘制饼图:

我对原始代码做了两次修改: 1只允许有三个弧

 function update() {
            arraySize = 3;// it is total number of sectors
            streakerDataAdded = d3.range(arraySize).map(fillArray); // value is fed into streakerDataAdded

        oldPieData = filteredPieData;
        pieData = donut(streakerDataAdded);//piedata is donut and value fed into
2我手动设置弧的值

var totalOctets = 0;
    filteredPieData = pieData.filter(filterData);

    filteredPieData[0].value=4000;
    filteredPieData[1].value=8000;
    filteredPieData[2].value=16000;
    totalOctets=filteredPieData[0].value+filteredPieData[1].value+filteredPieData[2].value;
    filteredPieData[0].name="Silver";
    filteredPieData[1].name="Gold";
    filteredPieData[2].name="Copper";

    //angle
    filteredPieData[0].startAngle=0;
    filteredPieData[0].endAngle=filtere

dPieData[0].value/totalOctets*2*Math.PI;
        filteredPieData[1].startAngle=filteredPieData[0].endAngle;
        filteredPieData[1].endAngle=filteredPieData[1].startAngle+filteredPieData[1].value/totalOctets*2*Math.PI;
        filteredPieData[2].startAngle=filteredPieData[1].endAngle;
        filteredPieData[2].endAngle=filteredPieData[2].startAngle+filteredPieData[2].value/totalOctets*2*Math.PI;
完整代码如下: 到目前为止,一切顺利。所需的函数是,如果我单击其中一个黄金,将调用一个函数,黄金弧的值将增加1000,而银和铜的值都将减少500

我试着这样做:

paths = arc_group.selectAll("path").data(filteredPieData);
            paths.enter().append("svg:path")
                .attr("stroke", "white")
                .attr("stroke-width", 0.5)
                .attr("fill", function(d, i) { return color(i); })
                .transition()
                .duration(tweenDuration)
                .attrTween("d", pieTween)
                .on("click", function(d,i){
                  filteredPieData[1].value=filteredPieData[1].value+1000;
                  filteredPieData[0].value=filteredPieData[0].value-500;
                  filteredPieData[2].value=filteredPieData[2].value-500;
});

但它不起作用。救命啊

刚刚解决了这个问题。onlick函数应该直接添加到.attr的下面,而不是刚刚解决的.attrTween。onlick函数应该直接添加到.attr而不是.attrTween下面