有没有更好的方法来标记每个组?

时间:2019-08-08 19:22:12

标签: d3.js

我要标记每个组是否有更好的方法呢? 现在我正在这样做:

     const svgViewport = d3.select("body")
                .append("svg")
                .attr("width", 150)
                .attr("height", 150);

            let myData = [
                [{
                    x: 30,
                    y: 40
                },
                    {
                        x: 30,
                        y: 60
                    }
                ],
                [{
                    x: 70,
                    y: 40
                },
                    {
                        x: 70,
                        y: 60
                    }
                ]
            ];

            let labelData=[{name:"group1",x:20,y:30},
                {name:"group2",x:70,y:30}];

            const groups = svgViewport.selectAll(null)
                .data(myData)
                .enter()
                .append("g");

            const circles = groups.selectAll(null)
                .data(d => d)
                .enter()
                .append("circle")
                .attr("cx", (d) => d.x)
                .attr("cy", (d) => d.y)
                .attr("r", 10);


            const labels=svgViewport.selectAll("g").data(labelData).append("text").text((d)=>{return d.name;}).attr("x",(d)=>{return d.x})
                .attr("y",(d)=>{return d.y});

我要标记每组形状,是否可以在不保持labelData的x和y位置的情况下完成?

0 个答案:

没有答案