Reactjs D3和x2B;小册子地图

Reactjs D3和x2B;小册子地图,reactjs,dictionary,d3.js,leaflet,Reactjs,Dictionary,D3.js,Leaflet,我试图制作一张地图,并在同一张地图中用d3绘制管脚,但不知何故,管脚没有出现,我没有得到任何错误,但有时会出现这种错误 我的代码基本上是从api中获取数据,从lat中获取数据,然后将其放入传单图中。 g.selectAll(…).data(…).enter不是函数 这是我的密码 React.useEffect(() => { async function getWellheadf() { const getWellhead = await ApiS

我试图制作一张地图,并在同一张地图中用d3绘制管脚,但不知何故,管脚没有出现,我没有得到任何错误,但有时会出现这种错误

我的代码基本上是从api中获取数据,从lat中获取数据,然后将其放入传单图中。
g.selectAll(…).data(…).enter不是函数

这是我的密码

 React.useEffect(() => {
        async function getWellheadf() {
            const getWellhead = await ApiService.getWellhead();

            const svg = d3.select(mapref.current).select("svg"),
                g = svg.append("g");
            getWellhead.data.forEach(function (d) {
                d.LatLng = new L.latLng(d.Latitude, d.Longitude);
                setWellhead(d.LatLng)
            })
            if (map) {
                L.tileLayer('https://services.arcgisonline.com/arcgis/rest/services/Ocean/World_Ocean_Base/MapServer/tile/{z}/{y}/{x}.png', {
                    id: 'mapbox/streets-v11',
                }).addTo(map);
                console.log(wellhead)
                const feature = g.selectAll("circle")
                    .data(wellhead)
                    .join("circle")
                    .enter().append("circle")
                    .style("stroke", "black")
                    .style("opacity", .6)
                    .style("fill", "red")
                    .attr("r", 20);

                const update = () => {
                    feature.attr("transform",
                        function (d) {

                            return "translate(" +
                                map.latLngToLayerPoint(d.LatLng).x + "," +
                                map.latLngToLayerPoint(d.LatLng).y + ")";
                        }
                    )
                }
                map.on("viewreset", update);



                // L.circle(wellhead, {
                //     color: 'black',
                //     fillColor: '#f03',
                //     fillOpacity: 0.5,
                //     radius: 500
                // }).addTo(map);
            }
        }
        getWellheadf();
    }, [map]);


您好,当您输入数据以添加圆圈时
const feature=g.selectAll(“圆圈”)。数据(井口)
井口来自何处?您好,当您输入数据以添加圆圈时
const feature=g.selectAll(“圆圈”)。数据(井口)
井口来自何处?