d3.select适用于body，但不适用于id。我遗漏了什么？

Question

我试着用d3.js，React和PatternFly 4做一个简单的折线图。我也做了其他的图，他们用select id工作，但是这个拒绝工作，我不能把我的手指指向这个问题。

请注意，id在调用该类时已经创建，因此它在select发生时存在。

render() {

### This only works if I replace "#linechart" by "body"
var svg = d3.select("#linechart").append("svg")
        .attr("width", width + margin.left + margin.right)
        .attr("height", height + margin.top + margin.bottom)
        .append("g")
        .attr("transform",
            "translate(" + margin.left + "," + margin.top + ")");

x.domain(d3.extent(data, function(d) { return d.date; }));
y.domain([0, d3.max(data, function(d) { return d.close; })]);
svg.append("path")
        .data([data])
        .attr("class", "line")
        .attr("d", valueline);

svg.append("g")
        .attr("transform", "translate(0," + height + ")")
        .call(d3.axisBottom(x));

svg.append("g")
        .call(d3.axisLeft(y));
return ( 
   <div id={"#" + this.props.id}></div>
);

我现在是d3.js的新手，这段代码很像是一个在线示例的复制粘贴，只做了一些调整。

Answer 1

我也有同样的问题。我将svg的所有代码放在一个函数中，然后在componentDidMount()中调用它。