D3.js - 链接未显示在地图上（传单）

Question

因此，我在地图上做了一个简单的表示，其中有节点和链接，一个简单的数据只是为了在连接到 json 文件之前对其进行测试，并且我使用 leaflet.js 作为地图。我将展示我的以下 JavaScrip、CSS 和 HTML。

基本上，我可以看到我的节点在地图上创建，但是当涉及到链接时，它们不会在任何地方显示。我确信我在某个地方犯了错误，但我不知道在哪里。我敢打赌，一双新的眼睛可以指出我的基本错误。有人可以帮我吗？（注意：在我插入地图并尝试将节点与链接连接之前，它工作得很好）

问题如何显示地图中节点之间的链接？

Answer 1

我忘记调整 html 中的坐标和lat轴long，就像我在圆圈中所做的那样。xy基本上这是我的结果：d3.select("#mapid")     .select("svg")    .selectAll("line")    .data(links)        .enter()    .append("line")    .attr("x1", function(d) { return map.latLngToLayerPoint([d.source.lat, d.source.long]).x})    .attr("y1", function(d) { return map.latLngToLayerPoint([d.source.lat, d.source.long]).y})    .attr("x2", function(d) { return map.latLngToLayerPoint([d.target.lat, d.target.long]).x})    .attr("y2", function(d) { return map.latLngToLayerPoint([d.target.lat, d.target.long]).y})    .style("stroke", function(d, i)    {        if(d.fraude == 2)        { return "rgb(197,53,53)"}        else        { return "rgb(96,211,62"}            })    .style("stroke-width", 5)    我还必须更新功能更新，因为如果我不这样做，线条将始终保留在框架中：function update() {d3.selectAll("circle")    .attr("cx", function(d){ return map.latLngToLayerPoint([d.lat, d.long]).x })    .attr("cy", function(d){ return map.latLngToLayerPoint([d.lat, d.long]).y })d3.selectAll("line")    .attr("x1", function(d) { return map.latLngToLayerPoint([d.source.lat, d.source.long]).x})    .attr("y1", function(d) { return map.latLngToLayerPoint([d.source.lat, d.source.long]).y})    .attr("x2", function(d) { return map.latLngToLayerPoint([d.target.lat, d.target.long]).x})    .attr("y2", function(d) { return map.latLngToLayerPoint([d.target.lat, d.target.long]).y})}