Remove hard-coded map data
This commit is contained in:
parent
04dc3d9a58
commit
10a1eb409e
@ -275,7 +275,6 @@
|
|||||||
<text class="elevation" x="15" y="49">2</text>
|
<text class="elevation" x="15" y="49">2</text>
|
||||||
</g>
|
</g>
|
||||||
|
|
||||||
<!-- TODO this building has a special transform. see radial.js -->
|
|
||||||
<g class="building4" data-q="15" data-r="-7" data-s="-8" data-el="0,1" data-transform="special">
|
<g class="building4" data-q="15" data-r="-7" data-s="-8" data-el="0,1" data-transform="special">
|
||||||
<use href="#building4"/>
|
<use href="#building4"/>
|
||||||
<g class="footprint">
|
<g class="footprint">
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 47 KiB After Width: | Height: | Size: 47 KiB |
288
src/radial.js
288
src/radial.js
@ -153,235 +153,6 @@ function translateCoords(map, translator) {
|
|||||||
return translated;
|
return translated;
|
||||||
}
|
}
|
||||||
|
|
||||||
const buildingHexes = {};
|
|
||||||
|
|
||||||
buildingHexes.bld1 = generateRadialCoords(
|
|
||||||
new Map(),
|
|
||||||
{ q: 0, r: 0, s: 0 },
|
|
||||||
{ left: 2, top: 4, right: 3, bottom: 5 },
|
|
||||||
'left'
|
|
||||||
);
|
|
||||||
|
|
||||||
buildingHexes.bld2 = [
|
|
||||||
[{ q: 0, r: 0, s: 0 }, { left: 3, top: 5, right: 3, bottom: 5 }, 'both'],
|
|
||||||
[{ q: 3, r: 0, s: -3 }, { left: 1, top: 2, right: 1, bottom: 4 }, 'right'],
|
|
||||||
[{ q: -3, r: 0, s: 3 }, { left: 1, top: 2, right: 1, bottom: 4 }, 'left'],
|
|
||||||
].reduce((acc, args) => new Map([...generateRadialCoords(acc, ...args)]), new Map());
|
|
||||||
|
|
||||||
buildingHexes.bld3 = generateRadialCoords(
|
|
||||||
new Map(),
|
|
||||||
{ q: 0, r: 0, s: 0 },
|
|
||||||
{ left: 2, top: 3, right: 2, bottom: 4 }
|
|
||||||
);
|
|
||||||
|
|
||||||
buildingHexes.bld4 = generateRadialCoords(
|
|
||||||
new Map(),
|
|
||||||
{ q: 0, r: 0, s: 0 },
|
|
||||||
{ left: 2, top: 4, right: 3, bottom: 5 },
|
|
||||||
'left'
|
|
||||||
);
|
|
||||||
|
|
||||||
buildingHexes.bld5 = generateRadialCoords(
|
|
||||||
new Map(),
|
|
||||||
{ q: 0, r: 0, s: 0 },
|
|
||||||
{ left: 5, top: 3, right: 4, bottom: 2 }
|
|
||||||
);
|
|
||||||
|
|
||||||
buildingHexes.bld6 = generateRadialCoords(
|
|
||||||
new Map(),
|
|
||||||
{ q: 0, r: 0, s: 0 },
|
|
||||||
{ left: 1, top: 5, right: 2, bottom: 4 }
|
|
||||||
);
|
|
||||||
|
|
||||||
buildingHexes.bld7 = [
|
|
||||||
[{ q: 0, r: 0, s: 0 }, { left: 7, top: 4, right: 7, bottom: 3 }, 'left'],
|
|
||||||
[{ q: 1, r: -4, s: 3 }, { left: 5, top: 1, right: 6, bottom: 1 }],
|
|
||||||
[{ q: 5, r: 3, s: -8 }, { left: 1, top: 1, right: 2, bottom: 1 }],
|
|
||||||
[{ q: -4, r: 3, s: 1 }, { left: 3, top: 1, right: 4, bottom: 1 }],
|
|
||||||
].reduce((acc, args) => new Map([...generateRadialCoords(acc, ...args)]), new Map());
|
|
||||||
|
|
||||||
buildingHexes.bld8 = [
|
|
||||||
[{ q: 0, r: 0, s: 0 }, { left: 6, top: 7, right: 6, bottom: 4 }, 'both'],
|
|
||||||
[{ q: 5, r: 2, s: -7 }, { left: 1, top: 2, right: 1, bottom: 2 }],
|
|
||||||
[{ q: 1, r: 5, s: -6 }, { left: 4, top: 2, right: 4, bottom: 2 }, 'both'],
|
|
||||||
[{ q: -2, r: 4, s: -2 }, { left: 1, top: 1, right: 1, bottom: 1 }],
|
|
||||||
[{ q: 7, r: -7, s: 0 }, { left: 2, top: 1, right: 2, bottom: 1 }],
|
|
||||||
[{ q: -2, r: -7, s: 9 }, { left: 2, top: 1, right: 2, bottom: 1 }],
|
|
||||||
[{ q: -3, r: -6, s: 9 }, { left: 1, top: 1, right: 1, bottom: 2 }, 'left'],
|
|
||||||
[{ q: -7, r: 3, s: 4 }, { left: 1, top: 3, right: 2, bottom: 3 }, 'right'],
|
|
||||||
[{ q: -7, r: 4, s: 3 }, { left: 1, top: 1, right: 1, bottom: 1 }]
|
|
||||||
].reduce((acc, args) => new Map([...generateRadialCoords(acc, ...args)]), new Map());
|
|
||||||
|
|
||||||
const mapsheetHexCoords = generateRadialCoords(
|
|
||||||
new Map(),
|
|
||||||
{ q: 0, r: 0, s: 0 },
|
|
||||||
{ left: 17, top: 13, right: 17, bottom: 14 },
|
|
||||||
'left'
|
|
||||||
);
|
|
||||||
|
|
||||||
const mapsheet1 = {
|
|
||||||
id: 'mapsheet1',
|
|
||||||
grid: new Map(mapsheetHexCoords),
|
|
||||||
buildings: [
|
|
||||||
{
|
|
||||||
type: 'building2',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: buildingHexes.bld2,
|
|
||||||
position: ({ q, r, s }) => ({ q: q + 7, r: r + 7, s: s - 14 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building3',
|
|
||||||
elevationLevels: range(-1, 2),
|
|
||||||
grid: new Map(buildingHexes.bld3),
|
|
||||||
position: ({ q, r, s }) => ({ q: q - 6, r: r - 6, s: s + 12 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building4',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: generateRadialCoords(
|
|
||||||
new Map(),
|
|
||||||
{ q: 0, r: 0, s: 0 },
|
|
||||||
{ left: 2, top: 4, right: 3, bottom: 5 },
|
|
||||||
'right'
|
|
||||||
),
|
|
||||||
position: ({ q, r, s }) => ({
|
|
||||||
q: q + 15,
|
|
||||||
r: r - 7,
|
|
||||||
s: s - 8,
|
|
||||||
transform: (x, y) => `translate(${x + horzSpacing}, ${y})`
|
|
||||||
})
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building6',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: new Map(buildingHexes.bld6),
|
|
||||||
position: rotate180({ q: -13, r: 7, s: 6 })
|
|
||||||
},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
{
|
|
||||||
type: 'terrain',
|
|
||||||
grid: generateRadialCoords(
|
|
||||||
new Map(),
|
|
||||||
{ q: 0, r: 0, s: 0 },
|
|
||||||
{ left: 3, top: 5, right: 3, bottom: 5 }
|
|
||||||
),
|
|
||||||
position: ({ q, r, s }) => ({ q, r, s })
|
|
||||||
}
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
const mapsheet2 = {
|
|
||||||
id: 'mapsheet2',
|
|
||||||
grid: new Map(mapsheetHexCoords),
|
|
||||||
buildings: [
|
|
||||||
{
|
|
||||||
type: 'building1',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: new Map(buildingHexes.bld1),
|
|
||||||
position: ({ q, r, s }) => ({ q: q + 1, r: r + 6, s: s - 7 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building2',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: new Map(buildingHexes.bld2),
|
|
||||||
position: ({ q, r, s }) => ({ q: q + 7, r: r + 7, s: s - 14 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building3',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: new Map(buildingHexes.bld3),
|
|
||||||
position: ({ q, r, s }) => ({ q: q - 14, r: r + 5, s: s + 9 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building4',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: new Map(buildingHexes.bld4),
|
|
||||||
position: ({ q, r, s }) => ({ q: q - 8, r: r + 6, s: s + 2 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building5',
|
|
||||||
elevationLevels: range(-1, 3),
|
|
||||||
grid: new Map(buildingHexes.bld5),
|
|
||||||
position: ({ q, r, s }) => ({ q: q + 13, r: r - 6, s: s - 7 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building6',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: new Map(buildingHexes.bld6),
|
|
||||||
position: ({ q, r, s }) => ({ q: q + 7, r: r - 6, s: s - 1 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building7',
|
|
||||||
elevationLevels: range(-1, 3),
|
|
||||||
grid: new Map(buildingHexes.bld7),
|
|
||||||
position: ({ q, r, s }) => ({ q: q - 6, r: r - 5, s: s + 11 }),
|
|
||||||
},
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
const mapsheet3 = {
|
|
||||||
id: 'mapsheet3',
|
|
||||||
grid: new Map(mapsheetHexCoords),
|
|
||||||
buildings: [
|
|
||||||
{
|
|
||||||
type: 'building1',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: new Map(buildingHexes.bld1),
|
|
||||||
position: ({ q, r, s }) => ({ q: q - 1, r: r - 6, s: s + 7 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building2',
|
|
||||||
elevationLevels: range(-1, 3),
|
|
||||||
grid: new Map(buildingHexes.bld2),
|
|
||||||
position: rotate180({ q: 9, r: -6, s: -3 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building3',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: new Map(buildingHexes.bld3),
|
|
||||||
position: rotate180({ q: 17, r: -7, s: -10 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building4',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: new Map(buildingHexes.bld4),
|
|
||||||
position: rotate180({ q: -10, r: -5, s: 15 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building5',
|
|
||||||
elevationLevels: range(-1, 2),
|
|
||||||
grid: new Map(buildingHexes.bld5),
|
|
||||||
position: ({ q, r, s }) => ({ q: q + 6, r: r + 8, s: s - 14 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building6',
|
|
||||||
elevationLevels: range(0, 1),
|
|
||||||
grid: new Map(buildingHexes.bld6),
|
|
||||||
position: rotate180({ q: 0, r: 6, s: -6 })
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'building7',
|
|
||||||
elevationLevels: range(-1, 2),
|
|
||||||
grid: new Map(buildingHexes.bld7),
|
|
||||||
position: ({ q, r, s }) => ({ q: q - 12, r: r + 8, s: s + 4 })
|
|
||||||
},
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
const mapsheet4 = {
|
|
||||||
id: 'mapsheet4',
|
|
||||||
grid: new Map(mapsheetHexCoords),
|
|
||||||
buildings: [
|
|
||||||
{
|
|
||||||
type: 'building8',
|
|
||||||
elevationLevels: range(0, 2),
|
|
||||||
grid: buildingHexes.bld8,
|
|
||||||
position: ({ q, r, s }) => ({ q: q + 1, r: r + 1, s: s - 2 })
|
|
||||||
},
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|
||||||
function range(start, stop, step = 1) {
|
function range(start, stop, step = 1) {
|
||||||
return Array.from({ length: (stop - start) / step + 1 }, (_, i) => start + i * step);
|
return Array.from({ length: (stop - start) / step + 1 }, (_, i) => start + i * step);
|
||||||
}
|
}
|
||||||
@ -589,11 +360,6 @@ function findScalar(arr, width, height) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
const mapsheets = [mapsheet1, mapsheet2, mapsheet3, mapsheet4].reduce((acc, ms) => {
|
|
||||||
acc[ms.id] = ms;
|
|
||||||
return acc;
|
|
||||||
}, {});
|
|
||||||
|
|
||||||
let sheets = [];
|
let sheets = [];
|
||||||
|
|
||||||
const mapsheetsContainer = document.querySelector('.grid .mapsheets');
|
const mapsheetsContainer = document.querySelector('.grid .mapsheets');
|
||||||
@ -660,41 +426,9 @@ sheets = msGrps.map(msG => {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
// sheets = []
|
|
||||||
|
|
||||||
const scenarioMapsheets = document.querySelectorAll('.grid [class^="mapsheet"]');
|
const scenarioMapsheets = document.querySelectorAll('.grid [class^="mapsheet"]');
|
||||||
|
|
||||||
// sheets = [...scenarioMapsheets].reduce((acc, m) => {
|
|
||||||
// const [mapName] = m.classList;
|
|
||||||
// if (mapsheets[mapName]) {
|
|
||||||
// acc.push([mapsheets[mapName]]);
|
|
||||||
// m.remove();
|
|
||||||
// }
|
|
||||||
// return acc;
|
|
||||||
// }, []);
|
|
||||||
|
|
||||||
//scenarioMapsheets.forEach(el => el.remove());
|
|
||||||
document.querySelectorAll('use[href^="#building"]').forEach(el => el.remove());
|
document.querySelectorAll('use[href^="#building"]').forEach(el => el.remove());
|
||||||
|
|
||||||
// sheets = [[mapsheet1]];
|
|
||||||
// sheets = [[mapsheet2]];
|
|
||||||
// sheets = [[mapsheet2], [mapsheet3]];
|
|
||||||
// sheets = [[mapsheet2], [mapsheet1], [mapsheet3]];
|
|
||||||
|
|
||||||
// drawMapsheet(grid, mapsheet2, vectorAdd({ q: 0, r: 0, s: 0 }, { q: 1, r: -2, s: 1 }, 6));
|
|
||||||
|
|
||||||
// sheets = [
|
|
||||||
// [mapsheet2, mapsheet1],
|
|
||||||
// [mapsheet3, mapsheet4]
|
|
||||||
// ];
|
|
||||||
|
|
||||||
// drawBuildings([{
|
|
||||||
// type: 'building2',
|
|
||||||
// elevationLevels: range(-1, 2),
|
|
||||||
// grid: new Map(buildingHexes.bld2),
|
|
||||||
// position: coords => coords
|
|
||||||
// }], grid, { q: 0, r: 0, s: 0 });
|
|
||||||
|
|
||||||
let finalGrid = new Map();
|
let finalGrid = new Map();
|
||||||
|
|
||||||
findScalar(findMult(sheets), +width + 1, +height).forEach(([vscalar, row]) => {
|
findScalar(findMult(sheets), +width + 1, +height).forEach(([vscalar, row]) => {
|
||||||
@ -719,19 +453,6 @@ function addGroup(container, className) {
|
|||||||
return g;
|
return g;
|
||||||
}
|
}
|
||||||
|
|
||||||
// const { left, right, top, bottom } = document.currentScript.dataset;
|
|
||||||
//
|
|
||||||
// if (left && right && top && bottom) {
|
|
||||||
// const map = generateRadialCoords(
|
|
||||||
// new Map(),
|
|
||||||
// { q: 0, r: 0, s: 0 },
|
|
||||||
// { left: +left, top: +top, right: +right, bottom: +bottom },
|
|
||||||
// 'both'
|
|
||||||
// );
|
|
||||||
//
|
|
||||||
// drawHexes(addGroup(grid, 'elevation-0'), map);
|
|
||||||
// }
|
|
||||||
|
|
||||||
function toRect({ left, right, top, bottom }) {
|
function toRect({ left, right, top, bottom }) {
|
||||||
return { left: +left, right: +right, top: +top, bottom: +bottom };
|
return { left: +left, right: +right, top: +top, bottom: +bottom };
|
||||||
}
|
}
|
||||||
@ -740,12 +461,3 @@ function toRad({ q, r, s }) {
|
|||||||
return { q: +q, r: +r, s: +s };
|
return { q: +q, r: +r, s: +s };
|
||||||
}
|
}
|
||||||
|
|
||||||
// const mapsheetEls = document.querySelectorAll('.grid .mapsheet');
|
|
||||||
|
|
||||||
// drawHexes(addGroup(grid, 'elevation-0'), translateCoords(generateRadialCoords(
|
|
||||||
// new Map(),
|
|
||||||
// { q: 5, r: -4, s: -1 },
|
|
||||||
// { left: 2, top: 4, right: 3, bottom: 5 }
|
|
||||||
// , 'both'
|
|
||||||
// ), ({ q, r, s }) => ({ q, r, s })), true);
|
|
||||||
// ), ({ q, r, s }) => ({ q: -r, r: -s, s: -q })), true);
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user