javascript - How can I make my pie chart interactive, in D3.js?

Question

I'm trying to make a pie chart in D3.js with some interactions, like 'mouseover' showing tooltips and transition when loading. Here is my current code:

const graph = select(this.refs.pieChart);

graph
  .append("svg")
  .attr("width", width)
  .attr("height", height)
  .classed("PieChartGraphContainerSvg", true);

graph
  .select("svg")
  .append("g")
  .attr("width", width)
  .attr("height", height)
  .attr("transform", `translate(${width / 2},${height/2})`);

let pie = d3.pie().value(d => d.value).sort(null)

let arc = d3.arc().outerRadius(radius)
.innerRadius(0);

let path = graph.select('svg').select('g').datum(chartData).selectAll('path')
    .data(pie)
    .enter().append('path')
    .attr("fill", d => {
        return color(d.data.key)})
    .attr("d",arc)
    .each(d => this._current = d)


    

Answer 1

等待大神答复