JSFiddle - React, Tailwind, and code Playground

HTML

<div id="actual">
    <h1>Actual</h1>
</div>
<div id="expected">
    <h1>Expected</h1>
</div>

JavaScript

var actual = function(data) {
			
		// Finds a node with the given id
		var findNode = function(nodes, id) {
			for(var i = 0; i < nodes.length; i++) {
				if(nodes[i].Id === id) {
					return nodes[i];
				}
			}
			return null;
		};

		var svg = d3.select("#actual").append("svg")
					.attr("width", 600)
					.attr("height", 300)
                    .append("g")
                       .attr("transform", "translate(" + 20 + "," + 20 + ")");

		var endMarkers = svg.append('svg:defs')
							.append('svg:marker')
								.attr("id", "end-arrow")
								.attr("viewBox", "0 -5 10 10")
								.attr("refX", 29)
								.attr("markerWidth", 5)
								.attr("markerHeight", 5)
								.attr("orient", "auto")
							.append('svg:path')
								.attr('d', "M0,-5L10,0L0,5")
								.attr("fill", "#838383");

		var line = d3.svg.line()
						.x(function(d) { return findNode(data.nodes, d.source).x; })
						.y(function(d) { return findNode(data.nodes, d.target).y; })
						.interpolate("basis");

		/*var lines = svg.selectAll("line")
						.data(data.links)
						.enter()
						.append("svg:line")
							.attr("x1", function(d) { return findNode(data.nodes, d.source).x;})
							.attr("y1", function(d) { return findNode(data.nodes, d.source).y;})
							.attr("x2", function(d) { return findNode(data.nodes, d.target).x;})
							.attr("y2", function(d) { return findNode(data.nodes, d.target).y;})
							.style("stroke", "#838383")
							.style("stroke-width", 1)
							.style("marker-end", "url(#end-arrow)");*/

		var paths = svg.selectAll("path")
						.data(data.links)
						.enter()
						.append("svg:path")
							.attr("d", function(d) { 
								debugger;
								var src = findNode(data.nodes, d.source);
								var tgt = findNode(data.nodes, d.target);
								var xi = d3.interpolateNumber(src.x, tgt.x);
								var curvature = 0.8;

								return "M" + src.x + "," + src.y
									 + "C" + xi(curvature) + "," + src.y
									 + " " + xi(1 - curvature) + "," +...