js 拓扑图插件

// 创建SVG容器
var svg = d3.select("body").append("svg")
    .attr("width", 500)
    .attr("height", 500);

// 定义节点和边数据
var nodes = [
    {id: 1, x: 100, y: 100},
    {id: 2, x: 200, y: 200},
    {id: 3, x: 300, y: 100}
];
var links = [
    {source: 1, target: 2},
    {source: 2, target: 3}
];

// 绘制节点
svg.selectAll(".node")
    .data(nodes)
    .enter().append("circle")
    .attr("class", "node")
    .attr("cx", function(d) { return d.x; })
    .attr("cy", function(d) { return d.y; })
    .attr("r", 20);

// 绘制边
svg.selectAll(".link")
    .data(links)
    .enter().append("line")
    .attr("class", "link")
    .attr("x1", function(d) { return nodes.find(n => n.id === d.source).x; })
    .attr("y1", function(d) { return nodes.find(n => n.id === d.source).y; })
    .attr("x2", function(d) { return nodes.find(n => n.id === d.target).x; })
    .attr("y2", function(d) { return nodes.find(n => n.id === d.target).y; });