diff --git a/src/end-to-end.test.js b/src/end-to-end.test.js
index 2ac04be..ce6b55e 100644
--- a/src/end-to-end.test.js
+++ b/src/end-to-end.test.js
@@ -294,7 +294,7 @@ describe("When we wait for it to load", () => {
     // See if correct svg rendered
     let svg = document.getElementById("svg");
     expect(svg).toBeTruthy();
-    expect(svg.getElementsByTagName("title").length).toEqual(65);
+    expect(svg.getElementsByTagName("title").length).toEqual(50);
   });
 
   it("draws the right SVG for cactus multiple reads", async () => {
@@ -332,7 +332,7 @@ describe("When we wait for it to load", () => {
     // See if correct svg rendered
     let svg = document.getElementById("svg");
     expect(svg).toBeTruthy();
-    expect(svg.getElementsByTagName("title").length).toEqual(23);
+    expect(svg.getElementsByTagName("title").length).toEqual(22);
   });
 });
 
diff --git a/src/util/tubemap.js b/src/util/tubemap.js
index 471d041..304dc61 100644
--- a/src/util/tubemap.js
+++ b/src/util/tubemap.js
@@ -4019,15 +4019,17 @@ function defineSVGPatterns() {
 
 function drawTrackCurves(type, groupTrack) {
 
-  const myTrackCurves = trackCurves.filter(
+  const filteredTrackCurves = trackCurves.filter(
     filterObjectByAttribute("type", type)
   );
 
   const groupedCurves = {};
 
   // Group track curves based on if they have the same start and end node
-  myTrackCurves.forEach((curve) => {
-    const key = `${curve.nodeStart}-${curve.nodeEnd}`;
+  filteredTrackCurves.forEach((curve) => {
+    // We're going to split this back into numbers so we should not use - as a separator.
+    // TODO: Do we actually get negative oriented node numbers in here?
+    const key = `${curve.nodeStart},${curve.nodeEnd}`;
     if (!groupedCurves[key]) {
       groupedCurves[key] = [];
     }
@@ -4074,9 +4076,36 @@ function drawTrackCurves(type, groupTrack) {
     })
   });
 
+  // Rebuild one flat list of curves ordered by group and then using the within-group sort.
+  let groupKeys = [];
+  for (let key in groupedCurves) {
+    groupKeys.push(key);
+  }
+  groupKeys.sort(function(a, b) {
+    let aParts = a.split(",").map(parseInt);
+    let bParts = b.split(",").map(parseInt);
+    if (aParts[0] < bParts[0]) {
+      return -1;
+    } else if (aParts[0] > bParts[0]) {
+      return 1;
+    } else {
+      if (aParts[1] < bParts[1]) {
+        return -1;
+      } else if (aParts[1] > bParts[1]) {
+        return 1;
+      } else {
+        return 0;
+      }
+    }
+  })
+  let flattenedGroups = [];
+  for (let key of groupKeys) {
+    flattenedGroups = flattenedGroups.concat(groupedCurves[key]);
+  }
+
   groupTrack
     .selectAll("trackCurves")
-    .data(trackCurves)
+    .data(flattenedGroups)
     .enter()
     .append("path")
     .attr("d", (d) => d.path)