1 files changed, 6 insertions, 3 deletions
diff --git a/src/radial.js b/src/radial.js
index 09037ab..7c7c0f3 100644
--- a/src/radial.js
+++ b/src/radial.js
@@ -1,5 +1,6 @@
 const xmlns = 'http://www.w3.org/2000/svg';
 const grid = document.querySelector('svg .grid');
+const frontmost = grid.querySelector('.frontmost');
 
 const hex = {
   inradius: 8.66,
@@ -247,10 +248,10 @@ function drawBuildings(buildings, container, { q: pq, r: pr, s: ps }, features)
   }, new Map());
 }
 
-function drawMapsheet(gameboard, mapsheet, position) {
+function drawMapsheet(placementMarker, mapsheet, position) {
   const container = document.createElementNS(xmlns, 'g');
   container.classList.add(mapsheet.id);
-  gameboard.appendChild(container);
+  placementMarker.before(container);
 
   const buildingContainer = document.createElementNS(xmlns, 'g');
   buildingContainer.classList.add(mapsheet.id);
@@ -440,11 +441,13 @@ findScalar(findMult(sheets), +width + 1, +height).forEach(([vscalar, row]) => {
       return vectorAdd(coords, { q: -1, r: 0, s: 1 }, hscalar);
     }
 
-    ms = drawMapsheet(grid, ms, horzMapVect(vertMapVect({ q: 0, r: 0, s: 0 })));
+    ms = drawMapsheet(frontmost, ms, horzMapVect(vertMapVect({ q: 0, r: 0, s: 0 })));
     finalGrid = new Map([...finalGrid, ...ms]);
   })
 });
 
+document.querySelector('.grid .mapsheets').remove();
+
 function addGroup(container, className) {
   const g = document.createElementNS(xmlns, 'g');
   g.classList.add(className);