| index : btroops | |
| Virtual board game-aid for BattleTroops, an infantry combat simulator wargame published by FASA in 1989. |
| aboutsummaryrefslogtreecommitdiff |
diff options
| author | Catalin Mititiuc <webdevcat@proton.me> | 2024-05-28 15:42:04 -0700 |
|---|---|---|
| committer | Catalin Mititiuc <webdevcat@proton.me> | 2024-05-28 15:42:04 -0700 |
| commit | abc8b02a9c73e68f435d8971b2ef0e1970f42212 (patch) | |
| tree | a3660f4791baf571c6c4f0822f896aa5b171631b | |
| parent | 528a370ddcf9bc63b0b5ec757ee2ac97c505131e (diff) | |
WIP: select counter test
| -rw-r--r-- | src/modules/gameboard.js | 3 | ||||
| -rw-r--r-- | src/modules/record_sheet.js | 2 | ||||
| -rw-r--r-- | src/scenario-side_show.svg | 1973 | ||||
| -rw-r--r-- | test/integration/fixtures/scenario-test.svg | 24 | ||||
| -rw-r--r-- | test/integration/page.test.js | 99 |
5 files changed, 38 insertions, 2063 deletions
diff --git a/src/modules/gameboard.js b/src/modules/gameboard.js index a354795..38a9a9a 100644 --- a/src/modules/gameboard.js +++ b/src/modules/gameboard.js @@ -200,7 +200,8 @@ function endMove() { export function start(el) { svg = el; - getUnits(svg).forEach(unit => unit.addEventListener('click', selectOffBoard)); + const startingLocations = svg.querySelector('.start-locations'); + startingLocations && getUnits(startingLocations).forEach(unit => unit.addEventListener('click', selectOffBoard)); getCells(svg).forEach(cell => { cell.addEventListener('click', e => { diff --git a/src/modules/record_sheet.js b/src/modules/record_sheet.js index 61cea98..2865309 100644 --- a/src/modules/record_sheet.js +++ b/src/modules/record_sheet.js @@ -179,7 +179,7 @@ export function start(startLoc, units) { for (const affiliation in forces) { const container = document.querySelector(`#${affiliation}-record`); const records = container.querySelector('.records'); - const name = startLoc.dataset[`${affiliation}Name`]; + const name = startLoc?.dataset[`${affiliation}Name`]; if (name) { container.querySelector('.name').textContent = name; diff --git a/src/scenario-side_show.svg b/src/scenario-side_show.svg deleted file mode 100644 index e4211a0..0000000 --- a/src/scenario-side_show.svg +++ /dev/null @@ -1,1973 +0,0 @@ -<?xml version="1.0" standalone="no"?> -<svg viewBox="-15.639999389648438 -109 2320.879638671875 3280" xmlns="http://www.w3.org/2000/svg"> - <!-- <link xmlns="http://www.w3.org/1999/xhtml" rel="stylesheet" href="http://localhost:8080/assets/css/map.css" type="text/css" /> --> - <link xmlns="http://www.w3.org/1999/xhtml" rel="stylesheet" href="../css/map.css" type="text/css" /> - <style> - g[data-edge="north"] { --i: -2; } - g[data-edge="south"] { --i: 52; } - - #background { - stroke: #304b75; - fill: #bacae3; - } - - pattern use { - stroke: black; - stroke-width: 0.3px; - } - - .cw-60-deg { - transform: rotate(60deg); - } - - .ccw-60-deg { - transform: rotate(-60deg); - } - </style> - <defs> - <polygon id="hex" points="0,10 8.66,5 8.66,-5 0,-10 -8.66,-5 -8.66,5"/> - <circle id="counter-base" cx="0" cy="0" r="5"/> - - <line id="ast-line" x1="-1.2" y1="0" x2="1.2" y2="0"/> - - <pattern id="asterisk" viewBox="-8.66 -15 17.32 30" width="17.32" height="30" patternUnits="userSpaceOnUse"> - <use y="-15" href="#ast-line"/> - <use y="-15" style="transform-origin: 0 -15px;" class="cw-60-deg" href="#ast-line"/> - <use y="-15" style="transform-origin: 0 -15px;" class="ccw-60-deg" href="#ast-line"/> - <use y="15" href="#ast-line"/> - <use y="15" style="transform-origin: 0 15px;" class="cw-60-deg" href="#ast-line"/> - <use y="15" style="transform-origin: 0 15px;" class="ccw-60-deg" href="#ast-line"/> - - <use x="8.66" href="#ast-line"/> - <use x="8.66" style="transform-origin: 8.66px 0;" class="cw-60-deg" href="#ast-line"/> - <use x="8.66" style="transform-origin: 8.66px 0;" class="ccw-60-deg" href="#ast-line"/> - <use x="-8.66" href="#ast-line"/> - <use x="-8.66" style="transform-origin: -8.66px 0;" class="cw-60-deg" href="#ast-line"/> - <use x="-8.66" style="transform-origin: -8.66px 0;" class="ccw-60-deg" href="#ast-line"/> - </pattern> - - <g id="t-1" class="troop-counter-template"><use href="#counter-base"/><text>1</text></g> - <g id="t-2" class="troop-counter-template"><use href="#counter-base"/><text>2</text></g> - <g id="t-3" class="troop-counter-template"><use href="#counter-base"/><text>3</text></g> - <g id="t-4" class="troop-counter-template"><use href="#counter-base"/><text>4</text></g> - <g id="t-5" class="troop-counter-template"><use href="#counter-base"/><text>5</text></g> - <g id="t-6" class="troop-counter-template"><use href="#counter-base"/><text>6</text></g> - <g id="t-7" class="troop-counter-template"><use href="#counter-base"/><text>7</text></g> - - <g id="semi-auto"> - <line x1="-2" y1="1" x2="2" y2="1"/> - <line x1="-2" y1="2" x2="2" y2="2"/> - </g> - - <g id="auto"> - <line x1="-2" y1="0" x2="2" y2="0"/> - <line x1="-2" y1="1" x2="2" y2="1"/> - <line x1="-2" y1="2" x2="2" y2="2"/> - </g> - - <g id="rifle" class="weapon-symbol"> - <use href="#semi-auto"/> - <line x1="0" y1="-5" x2="0" y2="5"/> - <polyline points="-2,-3.5 0,-5 2,-3.5"/> - </g> - - <g id="smg" class="weapon-symbol"> - <use href="#auto"/> - <line x1="0" y1="-5" x2="0" y2="4.5"/> - <line x1="-2" y1="4.5" x2="2" y2="4.5"/> - </g> - - <g id="blazer" class="weapon-symbol"> - <use href="#auto"/> - <polyline points="0,-5 0,-3 -3,-2.5 3,-1.5 0,-1 0,2.5 -3,3, 3,4 0,4.5 0,5"/> - <polyline points="-2,-3.5 0,-5 2,-3.5"/> - </g> - - <image id="counter-prone" href="counter_prone.jpg" width="10"/> - <image id="counter-grenade" href="counter_grenade.jpg" width="10"/> - <image id="numbers" href="rendered_numbers.png" width="182" height="22"/> - - <symbol id="n1" viewBox="1 0 17 22" width="17" height="22"><use href="#numbers"/></symbol> - <symbol id="n2" viewBox="19 0 16 22" width="16" height="22"><use href="#numbers"/></symbol> - <symbol id="n3" viewBox="36 0 18 22" width="18" height="22"><use href="#numbers"/></symbol> - <symbol id="n4" viewBox="54 0 18 22" width="18" height="22"><use href="#numbers"/></symbol> - <symbol id="n5" viewBox="0 0 18 22" width="18" height="22"><use href="#numbers"/></symbol> - <symbol id="n6" viewBox="0 0 18 22" width="18" height="22"><use href="#numbers"/></symbol> - <symbol id="n7" viewBox="0 0 18 22" width="18" height="22"><use href="#numbers"/></symbol> - <symbol id="n8" viewBox="0 0 18 22" width="18" height="22"><use href="#numbers"/></symbol> - <symbol id="n9" viewBox="0 0 18 22" width="18" height="22"><use href="#numbers"/></symbol> - <symbol id="n0" viewBox="0 0 18 22" width="18" height="22"><use href="#numbers"/></symbol> - </defs> - - <rect id="background"/> - - <g class="gameboard"> - <!-- <use href="http://localhost:8080/assets/images/mapsheets.svg#map2"/> - <use href="http://localhost:8080/assets/images/mapsheets.svg#map3" style="transform: translate(0, 390.25px);"/> --> - <use class="mapsheets" href="mapsheets.%%VERSION%%.svg#map2"/> - <use class="mapsheets" href="mapsheets.%%VERSION%%.svg#map3" style="transform: translate(0, 390.25px);"/> - - <rect id="dots" fill="url(#asterisk)"/> - - <g id="firing-arcs"> - <g id="shapes"/> - <g id="lines"/> - </g> - - <g class="start-locations" data-attacker-name="liao" data-defender-name="davion"> - <g data-edge="north"> - <g data-x="13"> - <g class="counter" data-allegiance="attacker" data-number="1"> - <use href="#counter-base"/><use class="troop-number" href="#t-1"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#rifle"/> - <!-- <use data-href="counters.svg#rifle"/><use class="troop-number" href="#t-1"/><use class="squad-number" href="#t-1"/> --> - </g> - </g> - <g data-x="14"> - <g class="counter" data-allegiance="attacker" data-number="2"><use href="#counter-base"/><use class="troop-number" href="#t-2"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#rifle"/></g> - </g> - <g data-x="15"> - <g class="counter" data-allegiance="attacker" data-number="3"><use href="#counter-base"/><use class="troop-number" href="#t-3"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#smg"/></g> - </g> - <g data-x="16"> - <g class="counter" data-allegiance="attacker" data-number="4"><use href="#counter-base"/><use class="troop-number" href="#t-4"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#smg"/></g> - </g> - <g data-x="17"> - <g class="counter" data-allegiance="attacker" data-number="5"><use href="#counter-base"/><use class="troop-number" href="#t-5"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#smg"/></g> - </g> - <g data-x="18"> - <g class="counter" data-allegiance="attacker" data-number="6"><use href="#counter-base"/><use class="troop-number" href="#t-6"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#smg"/></g> - </g> - <g data-x="19"> - <g class="counter" data-allegiance="attacker" data-number="7"><use href="#counter-base"/><use class="troop-number" href="#t-7"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#blazer"/></g> - </g> - </g> - <g data-edge="south"> - <g data-x="13"> - <g class="counter" data-allegiance="defender" data-number="1"><use href="#counter-base"/><use class="troop-number" href="#t-1"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#rifle"/></g> - </g> - <g data-x="14"> - <g class="counter" data-allegiance="defender" data-number="2"><use href="#counter-base"/><use class="troop-number" href="#t-2"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#rifle"/></g> - </g> - <g data-x="15"> - <g class="counter" data-allegiance="defender" data-number="3"><use href="#counter-base"/><use class="troop-number" href="#t-3"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#smg"/></g> - </g> - <g data-x="16"> - <g class="counter" data-allegiance="defender" data-number="4"><use href="#counter-base"/><use class="troop-number" href="#t-4"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#smg"/></g> - </g> - <g data-x="17"> - <g class="counter" data-allegiance="defender" data-number="5"><use href="#counter-base"/><use class="troop-number" href="#t-5"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#smg"/></g> - </g> - <g data-x="18"> - <g class="counter" data-allegiance="defender" data-number="6"><use href="#counter-base"/><use class="troop-number" href="#t-6"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#smg"/></g> - </g> - <g data-x="19"> - <g class="counter" data-allegiance="defender" data-number="7"><use href="#counter-base"/><use class="troop-number" href="#t-7"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#blazer"/></g> - </g> - </g> - </g> - - <g class="grid"> - <g data-y="0"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="1"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="2"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="3"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="4"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="5"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="6"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="7"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="8"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="9"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="10"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="11"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="12"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="13"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="14"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="15"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="16"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="17"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="18"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="19"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="20"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="21"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="22"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="23"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="24"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="25"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="26"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="27"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="28"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="29"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="30"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="31"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="32"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="33"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="34"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="35"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="36"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="37"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="38"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="39"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="40"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="41"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="42"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="43"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="44"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="45"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="46"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="47"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="48"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="49"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - <g data-y="50"> - <g data-x="0"><use href="#hex"/></g> - <g data-x="1"><use href="#hex"/></g> - <g data-x="2"><use href="#hex"/></g> - <g data-x="3"><use href="#hex"/></g> - <g data-x="4"><use href="#hex"/></g> - <g data-x="5"><use href="#hex"/></g> - <g data-x="6"><use href="#hex"/></g> - <g data-x="7"><use href="#hex"/></g> - <g data-x="8"><use href="#hex"/></g> - <g data-x="9"><use href="#hex"/></g> - <g data-x="10"><use href="#hex"/></g> - <g data-x="11"><use href="#hex"/></g> - <g data-x="12"><use href="#hex"/></g> - <g data-x="13"><use href="#hex"/></g> - <g data-x="14"><use href="#hex"/></g> - <g data-x="15"><use href="#hex"/></g> - <g data-x="16"><use href="#hex"/></g> - <g data-x="17"><use href="#hex"/></g> - <g data-x="18"><use href="#hex"/></g> - <g data-x="19"><use href="#hex"/></g> - <g data-x="20"><use href="#hex"/></g> - <g data-x="21"><use href="#hex"/></g> - <g data-x="22"><use href="#hex"/></g> - <g data-x="23"><use href="#hex"/></g> - <g data-x="24"><use href="#hex"/></g> - <g data-x="25"><use href="#hex"/></g> - <g data-x="26"><use href="#hex"/></g> - <g data-x="27"><use href="#hex"/></g> - <g data-x="28"><use href="#hex"/></g> - <g data-x="29"><use href="#hex"/></g> - <g data-x="30"><use href="#hex"/></g> - <g data-x="31"><use href="#hex"/></g> - <g data-x="32"><use href="#hex"/></g> - </g> - </g> - </g> - <script>//<![CDATA[ - // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random#getting_a_random_integer_between_two_values_inclusive - // function getRandomIntInclusive(min, max) { - // const minCeiled = Math.ceil(min); - // const maxFloored = Math.floor(max); - // return Math.floor(Math.random() * (maxFloored - minCeiled + 1) + minCeiled); // The maximum is inclusive and the minimum is inclusive - // } - - // const cacheBuster = Array(20).fill(null).map(() => getRandomIntInclusive(0, 9)).join(''); - - // document.querySelectorAll('[data-href]').forEach(el => { - // el.setAttributeNS(null, 'href', el.dataset.href.split('#').join(`?v=${cacheBuster}#`)); - // }); - //]]></script> - <!-- <script href="http://localhost:8080/map.js"/> --> - <script href="../../map.js"/> -</svg> diff --git a/test/integration/fixtures/scenario-test.svg b/test/integration/fixtures/scenario-test.svg index 0e12afb..d4d8453 100644 --- a/test/integration/fixtures/scenario-test.svg +++ b/test/integration/fixtures/scenario-test.svg @@ -1,6 +1,6 @@ <?xml version="1.0" standalone="no"?> <svg viewBox="-150 -150 600 800" xmlns="http://www.w3.org/2000/svg"> - <!-- <link xmlns="http://www.w3.org/1999/xhtml" rel="stylesheet" href="../css/map.css" type="text/css"/> --> + <link xmlns="http://www.w3.org/1999/xhtml" rel="stylesheet" href="../css/map.css" type="text/css" /> <style> g[data-edge="north"] { --i: -2; } g[data-edge="south"] { --i: 52; } @@ -95,8 +95,26 @@ <g id="shapes"/> <g id="lines"/> </g> - <g class="grid"/> + <g class="grid"> + <g data-y="0"> + <g data-x="0"><use href="#hex"/></g> + <g data-x="1"><use href="#hex"/></g> + <g data-x="2"><use href="#hex"/></g> + </g> + <g data-y="1"> + <g data-x="0"><use href="#hex"/></g> + <g data-x="1"><use href="#hex"/> + <g class="counter" data-allegiance="attacker" data-number="1"><use href="#counter-base"/><use class="troop-number" href="#t-2"/><use class="squad-number" href="#t-1"/><use class="primary-weapon" href="#rifle"/></g> + </g> + <g data-x="2"><use href="#hex"/></g> + </g> + <g data-y="2"> + <g data-x="0"><use href="#hex"/></g> + <g data-x="1"><use href="#hex"/></g> + <g data-x="2"><use href="#hex"/></g> + </g> + </g> </g> - <script data-cols="10" data-rows="10"></script> + <script href="../../map.js"></script> </svg> diff --git a/test/integration/page.test.js b/test/integration/page.test.js index f708c4f..7046ef0 100644 --- a/test/integration/page.test.js +++ b/test/integration/page.test.js @@ -55,107 +55,36 @@ it('loads the page', async () => { }); it.only('selects an off-board soldier', async () => { -// it.only.each(Array(10).fill(null))('selects an off-board soldier', async () => { - - // const id = await driver.getWindowHandle(); - // const network = await getNetworkInstance(driver, id); - - // const intercept = await network.addIntercept(new AddInterceptParameters(InterceptPhase.BEFORE_REQUEST_SENT)); - - // await network.beforeRequestSent(async event => { - // console.log('request url', event.request.url); - // await network.provideResponse(new ProvideResponseParameters(event.request)); - // }); - - // await network.responseStarted(async event => { - // if (event.response.url.includes('scenario')) - // console.log('response', event.response); - // }); - - // await network.responseStarted(async (event) => { - // if (event.response.url.includes('scenario')) { - // console.log('event', event); - // console.log('request', event.request); - // console.log('response', event.response.result); - // } - // }); - - // await network.beforeRequestSent(async (event) => { - // if (event.request.url.includes('scenario')) { - // console.log('event', event); - // console.log('request', event.request.request); - // await network.provideResponse(new ProvideResponseParameters(event.request.request)); - // // await network.failRequest(event.request.request); - // } - // }); - const connection = await driver.createCDPConnection('page') const url = 'http://localhost:3005/assets/images/scenario-side_show.svg'; const httpResponse = new HttpResponse(url); - - // httpResponse.body = `<?xml version="1.0" standalone="no"?> - // <svg viewBox="-150 -150 300 300" xmlns="http://www.w3.org/2000/svg"> - // <circle cx="0" cy="0" r="50" fill="violet" /> - // </svg>`; - httpResponse.body = await fs.readFile('./test/integration/fixtures/scenario-test.svg', 'utf8'); httpResponse.addHeaders('Content-Type', 'image/svg+xml'); await driver.onIntercept(connection, httpResponse, async function () { console.log('intercepted'); - // await driver.switchTo().frame(await driver.findElement(By.css('object'))); - // console.log(await driver.getPageSource()); }); await driver.get('http://localhost:3005'); - // expect(await driver.getTitle()).toEqual('Infantry Combat Solo Basic'); - - await driver.wait(until.elementIsVisible(driver.findElement(By.css('object'))), 1000); - // await driver.wait(until.elementLocated(By.css('#dice')), 1000); - takeScreenshot(driver); - // await driver.switchTo().frame(await driver.findElement(By.css('object'))); - - // console.log(await driver.getPageSource()); - - // const testDir = path.dirname(expect.getState().testPath); - // await writeFile(path.join(testDir, `scenario.svg`), ` - // <?xml version="1.0" standalone="no"?> - // <svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"> - // </svg> - // `); - - - // const browser = await puppeteer.launch(); - - // // Create a page - // const page = await browser.newPage(); - - // await page.setRequestInterception(true); - - // page.on('request', interceptedRequest => { - // console.log('intercept req url', interceptedRequest.url()); - // interceptedRequest.continue(); - // }); - - // // Go to your site - // await page.goto('http://localhost:3005'); - - - // await browser.close(); - + await driver.wait(until.elementLocated(By.css('#dice')), 1000); + await driver.switchTo().frame(await driver.findElement(By.css('object'))); - // console.log('test dir', testDir); + const selector = '.counter[data-allegiance="attacker"][data-number="1"]', + svg = await driver.findElement(By.css('svg')), + counter = await driver.findElement(By.css(selector), svg); - // const selector = '.counter[data-allegiance="attacker"][data-number="1"]', - // svg = await driver.findElement(By.css('svg')), - // counter = await driver.findElement(By.css(selector), svg); + await counter.click(); - // await driver.findElement(By.css('#dice')); + expect(await counter.getAttribute('class')).toEqual(expect.stringContaining('selected')); + await driver.switchTo().defaultContent(); + expect(await driver.findElement(By.css('.soldier-record')).getAttribute('class')).toEqual(expect.stringContaining('selected')); - // await counter.click(); + await driver.switchTo().frame(await driver.findElement(By.css('object'))); + await counter.click(); - // expect(await counter.getAttribute('class')).toEqual(expect.stringContaining('selected')); - // await takeScreenshot(driver); + expect(await counter.getAttribute('class')).toEqual(expect.not.stringContaining('selected')); + await driver.switchTo().defaultContent(); + expect(await driver.findElement(By.css('.soldier-record')).getAttribute('class')).toEqual(expect.not.stringContaining('selected')); }); afterEach(async () => { |
