diff --git a/public/radial.html b/public/radial.html index eb67c94..2be7903 100644 --- a/public/radial.html +++ b/public/radial.html @@ -225,11 +225,40 @@ border-radius: 3px; background-color: #cdd9e9; } + + [class^="part"] use { + fill-opacity: 0.75; + } + + .part-1 use { + fill: lightseagreen; + } + + .part-2 use { + fill: lightyellow; + } + + .part-3 use { + fill: lightblue; + } + + .part-4 use { + fill: lightsteelblue; + } + + .part-5 use { + fill: lightsalmon; + } + + .part-6 use { + fill: lightgreen; + } - + + diff --git a/src/radial.js b/src/radial.js index 12a49d0..4ef77d2 100644 --- a/src/radial.js +++ b/src/radial.js @@ -331,6 +331,65 @@ buildingHexes.bld7 = generateRadialCoords( { left: 3, top: 1, right: 4, bottom: 1 } ); +buildingHexes.bld8 = generateRadialCoords( + new Map(), + { q: 0, r: 0, s: 0 }, + { left: 6, top: 7, right: 6, bottom: 4 }, + // { left: 1, top: 1, right: 1, bottom: 1 }, + 'both' +); + +buildingHexes.bld8 = generateRadialCoords( + buildingHexes.bld8, + { q: 5, r: 2, s: -7 }, + { left: 1, top: 2, right: 1, bottom: 2 } +); + +buildingHexes.bld8 = generateRadialCoords( + buildingHexes.bld8, + { q: 1, r: 5, s: -6 }, + { left: 4, top: 2, right: 4, bottom: 2 }, + 'both' +); + +buildingHexes.bld8 = generateRadialCoords( + buildingHexes.bld8, + { q: -2, r: 4, s: -2 }, + { left: 1, top: 1, right: 1, bottom: 1 } +); + +buildingHexes.bld8 = generateRadialCoords( + buildingHexes.bld8, + { q: 7, r: -7, s: 0 }, + { left: 2, top: 1, right: 2, bottom: 1 } +); + +buildingHexes.bld8 = generateRadialCoords( + buildingHexes.bld8, + { q: -2, r: -7, s: 9 }, + { left: 2, top: 1, right: 2, bottom: 1 } +); + +buildingHexes.bld8 = generateRadialCoords( + buildingHexes.bld8, + { q: -3, r: -6, s: 9 }, + { left: 1, top: 1, right: 1, bottom: 2 }, + 'left' +); + +buildingHexes.bld8 = generateRadialCoords( + buildingHexes.bld8, + { q: -7, r: 3, s: 4 }, + { left: 1, top: 3, right: 2, bottom: 3 }, + 'right' +); + +buildingHexes.bld8 = generateRadialCoords( + buildingHexes.bld8, + { q: -7, r: 4, s: 3 }, + { left: 1, top: 1, right: 1, bottom: 1 } +); + const grid = generateRadialCoordsRect({ rows: 25, columns: 33 }, { q: 22, r: -12, s: -10 }); // const grid = generateRadialCoordsRect({ rows: 52, columns: 33 }, translateRadialCoords({ q: 22, r: -12, s: -10 }, { q: 1, r: -2, s: 1 }, 7)); @@ -362,11 +421,16 @@ const mapsheet3BuildingCoords = [ translateCoords(buildingHexes.bld7, ({ q, r, s }) => ({ q: q - 12, r: r + 8, s: s + 4 })), ] +const mapsheet4BuildingCoords = [ + translateCoords(buildingHexes.bld8, ({ q, r, s }) => ({ q: q + 1, r: r + 1, s: s - 2 })), +] + const mapsheetHexCoords = generateRadialCoords(new Map(), { q: 0, r: 0, s: 0 }, { left: 17, top: 13, right: 17, bottom: 14 }, 'left'); const mapsheet1hexCoords = new Map(mapsheetHexCoords); const mapsheet2hexCoords = new Map(mapsheetHexCoords); const mapsheet3hexCoords = new Map(mapsheetHexCoords); +const mapsheet4hexCoords = new Map(mapsheetHexCoords); mapsheet1BuildingCoords.forEach(building => { for ([coords, v] of building) mapsheet1hexCoords.delete(coords); @@ -380,6 +444,10 @@ mapsheet3BuildingCoords.forEach(building => { for ([coords, v] of building) mapsheet3hexCoords.delete(coords); }); +mapsheet4BuildingCoords.forEach(building => { + for ([coords, v] of building) mapsheet4hexCoords.delete(coords); +}); + const gameboard = svg.querySelector('.gameboard'); let mapsheet1 = { @@ -400,6 +468,12 @@ let mapsheet3 = { buildings: mapsheet3BuildingCoords }; +let mapsheet4 = { + id: 'mapsheet4', + grid: mapsheet4hexCoords, + buildings: mapsheet4BuildingCoords +}; + function drawMapsheet(gameboard, { id, grid, buildings }) { const container = document.createElementNS(xmlns, 'g'); container.id = id; @@ -556,8 +630,18 @@ function findScalar(arr) { // console.log(findScalar(mults)); -const sheets = [[mapsheet2], [mapsheet3]]; +// const sheets = [[mapsheet2], [mapsheet3]]; // const sheets = [[mapsheet2], [mapsheet1], [mapsheet3]]; +// const sheets = [[mapsheet4]]; + +const sheets = [ + [mapsheet2, mapsheet1], + [mapsheet3, mapsheet4] +]; + +// drawHexes(gameboard, buildingHexes.bld8, true); + +// drawHexes(addGroup(gameboard, 'part-1'), bld8, true); findScalar(findMult(sheets)).forEach(([vscalar, row]) => { const vertMapVect = function(map) {