| index : btroops | |
| Virtual board game-aid for BattleTroops, an infantry combat simulator wargame published by FASA in 1989. |
| aboutsummaryrefslogtreecommitdiff |
diff options
Diffstat (limited to 'public/assets')
28 files changed, 3017 insertions, 0 deletions
diff --git a/public/assets/css/damage_block.css b/public/assets/css/damage_block.css new file mode 100644 index 0000000..cc7e4dc --- /dev/null +++ b/public/assets/css/damage_block.css @@ -0,0 +1,18 @@ +.damage-effect-indicator.bruise { + background-color: orange; +} + +.damage-effect-indicator.lethal { + background-color: red; +} + +.damage-effect-indicator { + width: 20px; + height: 30px; + margin: 0 auto; + padding: 0; + border: 1px solid black; + display: block; + user-select: none; + font-family: monospace; +} diff --git a/public/assets/css/map.css b/public/assets/css/map.css new file mode 100644 index 0000000..0c2fed9 --- /dev/null +++ b/public/assets/css/map.css @@ -0,0 +1,369 @@ +svg { + overflow: hidden; +} + +image { + image-rendering: pixelated; +} + +image.map-scans { + image-rendering: auto; +} + +text { + user-select: none; +} + +use[href="#hex"] { + opacity: 0; + fill: transparent; + fill-opacity: 0.5; + stroke-width: 0.5px; + stroke: black; +} + +use[href="#hex"].active { + opacity: 0.2; + fill: teal; + stroke: black; +} + +.sight-line-target use[href="#hex"] { + opacity: 1; + stroke: orangered; + fill-opacity: 0.04; +} + +polyline { + fill: none; +} + +polyline.move-trace { + stroke: white; + stroke-dasharray: 2; +} + +#background { + fill: #bacae3; +} + +#map2 { + transform-origin: 0px 0px; + transform: translate(-0.9px, -2.4px) scale(0.999, 1.007); +} + +#map3 { + transform-origin: 0px 0px; + transform: translate(1.3px, 1564.1px) rotate(0.1deg) scale(0.999, 1.002); +} + +#counter-base { + r: inherit; +} + +g.troop-counter, g.counter, g.troop-counter use { + r: inherit; +} + +g.troop-counter-template, g.troop-counter-template use { + r: inherit; +} + +g.weapon-symbol { + stroke: white; + stroke-width: 0.5px; +} + +g.troop-counter-template text { + fill: white; + font-size: 12px; + font-weight: bold; + font-family: monospace; + cursor: default; + text-anchor: middle; + pointer-events: none; + user-select: none; + transform: translateY(4px); + stroke: none; +} + +[href="#counter-prone"] { + transform: translate(-5px, 6px); +} + +[href="#counter-grenade"] { + transform: translate(-5px, -5px); +} + +g.clone { + stroke: white; + stroke-width: 0.5px; + stroke-dasharray: 1; +} + +g.clone [href="#counter-prone"] { + opacity: 0.5; +} + +.removed[href="#counter-prone"] { + opacity: 0.5; +} + +g[data-allegiance="defender"].clone { + fill: rgb(255, 126, 126); +} + +g[data-allegiance="attacker"].clone { + fill: rgb(130, 190, 130); +} + +text.counter, #troop-counter text { + font-size: 12px; + font-weight: bold; + fill: white; + font-family: sans-serif; + cursor: default; + text-anchor: middle; + transform: translateY(4px); + pointer-events: none; + user-select: none; +} + +polygon.firing-arc[data-allegiance="defender"] { + fill: red; +} + +polygon.firing-arc[data-allegiance="attacker"] { + fill: green; +} + +#shapes { + opacity: 0.1; +} + +#shapes polygon { + stroke: none; +} + +#lines polyline, #lines line { + fill: none; + stroke: black; + stroke-width: 0.5; +} + +#lines line { + stroke-opacity: 0.2; +} + +#lines line { + pointer-events: none; +} + +.sight-line { + stroke: orangered; + stroke-width: 0.5px; + pointer-events: none; +} + +#hex { + fill: inherit; + fill-opacity: inherit; + stroke: inherit; + stroke-width: inherit; + stroke-opacity: inherit; +} + +g.counter use, use[href*="#t-"] { + r: 5px; +} + +g.selected use { + animation: 1s selected 0.25s linear infinite; + stroke-width: 2px; + stroke: yellow; + r: 6px; +} + +@keyframes selected { + 50% { + /* stroke: yellow; */ + stroke-width: 0px; + r: 5px; + } +} + +.counter[data-allegiance="attacker"] { + fill: green; +} + +.counter[data-allegiance="defender"] { + fill: red; +} + +.gameboard { + transform: translate(19px, 31px) scale(4); +} + +/* Inradius and circumradius values come from the hexagon */ +.grid, g.start-locations { + --inradius: 8.66px; + --circumradius: 10px; + --x-step: calc(var(--inradius) * 2); + --y-step: calc((3 / 2) * var(--circumradius)); +} + +g[data-y], g.start-locations > g { + --translateX: 0; + transform: translate(var(--translateX), calc(var(--y-step) * var(--i))); +} + +g[data-y]:nth-child(odd) { + --translateX: calc(var(--inradius)); +} + +[data-x] use[href="#hex"] { + --scale: 1; + transform: scale(var(--scale)); +} + +[data-x]:hover use[href="#hex"] { + /* --scale: 0.95; */ + opacity: 1; + fill: orange; + stroke: black; +} + +[data-x]:hover use[href*="#t-"] { + transform: scale(1.5); +} + +[data-x] { + --scale: 1; + transform: translateX(calc(var(--x-step) * var(--i))) scale(var(--scale)); +} + +g[data-y="0"] { --i: 0; } +g[data-y="1"] { --i: 1; } +g[data-y="2"] { --i: 2; } +g[data-y="3"] { --i: 3; } +g[data-y="4"] { --i: 4; } +g[data-y="5"] { --i: 5; } +g[data-y="6"] { --i: 6; } +g[data-y="7"] { --i: 7; } +g[data-y="8"] { --i: 8; } +g[data-y="9"] { --i: 9; } +g[data-y="10"] { --i: 10; } +g[data-y="11"] { --i: 11; } +g[data-y="12"] { --i: 12; } +g[data-y="13"] { --i: 13; } +g[data-y="14"] { --i: 14; } +g[data-y="15"] { --i: 15; } +g[data-y="16"] { --i: 16; } +g[data-y="17"] { --i: 17; } +g[data-y="18"] { --i: 18; } +g[data-y="19"] { --i: 19; } +g[data-y="20"] { --i: 20; } +g[data-y="21"] { --i: 21; } +g[data-y="22"] { --i: 22; } +g[data-y="23"] { --i: 23; } +g[data-y="24"] { --i: 24; } +g[data-y="25"] { --i: 25; } +g[data-y="26"] { --i: 26; } +g[data-y="27"] { --i: 27; } +g[data-y="28"] { --i: 28; } +g[data-y="29"] { --i: 29; } +g[data-y="30"] { --i: 30; } +g[data-y="31"] { --i: 31; } +g[data-y="32"] { --i: 32; } +g[data-y="33"] { --i: 33; } +g[data-y="34"] { --i: 34; } +g[data-y="35"] { --i: 35; } +g[data-y="36"] { --i: 36; } +g[data-y="37"] { --i: 37; } +g[data-y="38"] { --i: 38; } +g[data-y="39"] { --i: 39; } +g[data-y="40"] { --i: 40; } +g[data-y="41"] { --i: 41; } +g[data-y="42"] { --i: 42; } +g[data-y="43"] { --i: 43; } +g[data-y="44"] { --i: 44; } +g[data-y="45"] { --i: 45; } +g[data-y="46"] { --i: 46; } +g[data-y="47"] { --i: 47; } +g[data-y="48"] { --i: 48; } +g[data-y="49"] { --i: 49; } +g[data-y="50"] { --i: 50; } +g[data-y="51"] { --i: 51; } +g[data-y="52"] { --i: 52; } +g[data-y="53"] { --i: 53; } +g[data-y="54"] { --i: 54; } +g[data-y="55"] { --i: 55; } +g[data-y="56"] { --i: 56; } +g[data-y="57"] { --i: 57; } +g[data-y="58"] { --i: 58; } +g[data-y="59"] { --i: 59; } +g[data-y="60"] { --i: 60; } +g[data-y="61"] { --i: 61; } +g[data-y="62"] { --i: 62; } +g[data-y="63"] { --i: 63; } +g[data-y="64"] { --i: 64; } +g[data-y="65"] { --i: 65; } +g[data-y="66"] { --i: 66; } +g[data-y="67"] { --i: 67; } +g[data-y="68"] { --i: 68; } +g[data-y="69"] { --i: 69; } +g[data-y="70"] { --i: 70; } +g[data-y="71"] { --i: 71; } +g[data-y="72"] { --i: 72; } +g[data-y="73"] { --i: 73; } +g[data-y="74"] { --i: 74; } +g[data-y="75"] { --i: 75; } +g[data-y="76"] { --i: 76; } + +[data-x="0"] { --i: 0; } +[data-x="1"] { --i: 1; } +[data-x="2"] { --i: 2; } +[data-x="3"] { --i: 3; } +[data-x="4"] { --i: 4; } +[data-x="5"] { --i: 5; } +[data-x="6"] { --i: 6; } +[data-x="7"] { --i: 7; } +[data-x="8"] { --i: 8; } +[data-x="9"] { --i: 9; } +[data-x="10"] { --i: 10; } +[data-x="11"] { --i: 11; } +[data-x="12"] { --i: 12; } +[data-x="13"] { --i: 13; } +[data-x="14"] { --i: 14; } +[data-x="15"] { --i: 15; } +[data-x="16"] { --i: 16; } +[data-x="17"] { --i: 17; } +[data-x="18"] { --i: 18; } +[data-x="19"] { --i: 19; } +[data-x="20"] { --i: 20; } +[data-x="21"] { --i: 21; } +[data-x="22"] { --i: 22; } +[data-x="23"] { --i: 23; } +[data-x="24"] { --i: 24; } +[data-x="25"] { --i: 25; } +[data-x="26"] { --i: 26; } +[data-x="27"] { --i: 27; } +[data-x="28"] { --i: 28; } +[data-x="29"] { --i: 29; } +[data-x="30"] { --i: 30; } +[data-x="31"] { --i: 31; } +[data-x="32"] { --i: 32; } + +.buildings { + display: none; +} + +#test-arcs line, #test-arcs polyline { + stroke: black; + fill: none; +} + +#test-arcs rect, #test-arcs polygon { + fill: black; + fill-opacity: 0.2; +} diff --git a/public/assets/css/soldier_record_block.css b/public/assets/css/soldier_record_block.css new file mode 100644 index 0000000..fb1d322 --- /dev/null +++ b/public/assets/css/soldier_record_block.css @@ -0,0 +1,55 @@ +span { + font-size: smaller; + font-family: monospace; + margin-right: 1em; +} + +.physical-status-track { + text-align: center; +} + +.physical-status-track span { + margin: 0; + padding: 0; + display: inline-block; + vertical-align: middle; +} + +.physical-status-track span[slot="block-number"] { + font-family: serif; + font-size: unset; +} + +ul { + margin: 0; + padding: 0; +} + +ul li { + display: inline; + margin-left: 1em; +} + +p { + margin: 0; +} + +.grenades input { + display: none; +} + +.grenades svg { + width: 14px; + height: 14px; + vertical-align: bottom; +} + +.grenades svg circle { + fill: none; + stroke: black; + stroke-width: 2px; +} + +.grenades input:checked + svg circle { + fill: gray; +} diff --git a/public/assets/css/style.css b/public/assets/css/style.css new file mode 100644 index 0000000..a973630 --- /dev/null +++ b/public/assets/css/style.css @@ -0,0 +1,411 @@ +body { + margin: 0; + display: flex; + overflow: hidden; +} + +#map-container { + flex-basis: 100%; + position: relative; + height: 100vh; +} + +svg, object { + background-color: darkgray; + width: 100%; + height: 100%; +} + +object { + opacity: 0; + transition: opacity 0.25s; +} + +svg image { + image-rendering: pixelated; +} + +svg image.map-scans { + image-rendering: auto; +} + +svg text { + user-select: none; +} + +div#status { + position: absolute; + bottom: 0; + right: 0; + margin: 3px; + display: none; + user-select: none; +} + +#hex-counter { + padding: 2px; + background-color: rgba(255, 255, 255, 0.5); + border-radius: 2px; +} + +#hex-count { + font-family: monospace; +} + +div#content { + display: flex; + border-left: 1px solid gray; + flex-basis: 0; + /* overflow: scroll; */ + max-height: 100vh; + flex-direction: column; + /* padding: 2px; */ + position: relative; +} + +#content > div:first-of-type { + padding: 2px; + border-bottom: 1px solid gray; +} + +#content #buttons { + line-height: 1.5em; +} + +#content input[type="checkbox"].visible { + position: absolute; + right: 0; +} + +#record-sheet { + /* max-height: 100%; */ + overflow-y: auto; + display: flex; + flex-direction: column; + /* display: none; */ + background-color: gray; +} + +#record-sheet .name { + text-transform: capitalize; +} + +#record-sheet > div { + /* padding: 0 2px; */ + overflow-y: auto; + /* border: 1px solid black; */ +} + +#record-sheet > div > p { + margin: 0; + margin-top: 0px; + margin-bottom: 1px; + padding: 6px 2px; + background-color: lightgray; +} + +#record-sheet > div > div { + /* border: 1px solid black; */ + margin-bottom: 1px; + padding: 6px 4px; + /* border-radius: 4px; */ +} + +#record-sheet > div:last-of-type { + margin-top: 2px; +} + +#record-sheet > div > div:last-of-type { + margin-bottom: 0; +} + +svg > defs > #point { + fill: inherit; + fill-opacity: inherit; + stroke: inherit; + stroke-width: inherit; + stroke-opacity: inherit; +} + +use[href="#point"] { + opacity: 0; + fill: teal; + fill-opacity: 0.2; + stroke: black; + stroke-width: 0.5px; +} + +use[href="#point"]:hover, use[href="#point"].hover { + opacity: 1; + fill: orange; +} + +use[href="#point"].active { + opacity: 0.2; +} + +polyline.move-trace { + stroke: gray; + stroke-dasharray: 2; + fill: none; +} + +g#grid { + transform: translate(19px, 31px) scale(4); +} + +#background { + fill: #bacae3; +} + +#map2 { + transform-origin: 0px 0px; + transform: translate(-0.9px, -2.4px) scale(0.999, 1.007); +} + +#map3 { + transform-origin: 0px 0px; + /* transform: translateY(1518px); */ + transform: translate(1.3px, 1564.1px) rotate(0.1deg) scale(0.999, 1.002); +} + +#panel { + display: none; + position: absolute; + right: 0; + background-color: white; + border: 1px solid black; + padding: 2px; +} + +#panel fieldset label { + display: block; + text-align: right; +} + +#toggle-firing-arc-vis { + position: absolute; + right: 0; + padding-top: 20px; +} + +#toggle-firing-arc-vis div { + margin-top: 10px; + writing-mode: vertical-lr; + transform: rotate(180deg); +} + +#counter-base { + r: inherit; +} + +g.troop-counter-template, g.troop-counter-template use { + r: inherit; +} + +g.troop-counter, g.troop-counter use { + r: inherit; +} + +g.troop-counter-template text { + fill: white; + font-size: 12px; + font-weight: bold; + font-family: monospace; + cursor: default; + text-anchor: middle; + pointer-events: none; + user-select: none; + transform: translateY(4px); + stroke: none; +} + +g.troop-counter [href="#counter-prone"] { + transform: translate(-5px, 6px); +} + +g#points g use.counter { + r: 5px; +} + +g#points g.hover use[href="#point"] { + opacity: 1; + fill: orange; +} + +g#points g.hover use.counter { + r: 7px; +} + +g#points use.clone { + stroke: white; + stroke-width: 0.5px; + stroke-dasharray: 1; +} + +g#points use[data-allegiance="defender"].clone { + fill: rgb(255, 126, 126); +} + +g#points use[data-allegiance="attacker"].clone { + fill: rgb(130, 190, 130); +} + +text.counter, #troop-counter text { + font-size: 12px; + font-weight: bold; + /* stroke: black; */ + fill: white; + /* stroke-width: 0.5px; */ + font-family: sans-serif; + cursor: default; + text-anchor: middle; + /* transform: translateY(25%); */ + transform: translateY(4px); + pointer-events: none; + user-select: none; +} + +polygon.firing-arc[data-allegiance="defender"] { + fill: red; +} + +polygon.firing-arc[data-allegiance="attacker"] { + fill: green; +} + +#shapes { + opacity: 0.1; +} + +#shapes polygon { + stroke: none; +} + +#lines polygon { + fill: none; + stroke: black; +} + +button.set-firing-arc img { + vertical-align: middle; + pointer-events: none; +} + +.sight-line { + stroke: orangered; + stroke-width: 0.5px; + pointer-events: none; +} + +.soldier-record { + display: inline-block; + position: relative; + white-space: nowrap; + background-color: white; +} + +.soldier-record[data-allegiance="attacker"] [slot="troop-number"] svg { + fill: green; +} + +.soldier-record[data-allegiance="defender"] [slot="troop-number"] svg { + fill: red; +} + +.soldier-record [slot="troop-number"] svg { + width: 20px; + height: 20px; + background-color: initial; + vertical-align: middle; +} + +.soldier-record [slot="troop-number"] svg text { + fill: white; + text-anchor: middle; + font-size: 10px; + font-weight: bold; + transform: translateY(3.5px); + font-family: monospace; +} + +.soldier-record[data-allegiance="defender"] [slot="troop-number"] img { + fill: red; +} + +.soldier-record[data-allegiance="attacker"] [slot="troop-number"] img { + fill: green; +} + +.soldier-record.selected { + background-color: khaki; +} + +.soldier-record.movement-ended { + background-color: none; + opacity: 0.5; +} + +.wall { + fill: none; + stroke: red; + stroke-width: 7px; + opacity: 0.7; +} + +#asterisk { + font-size: 30; +} + +img.logo { + width: 100px; + margin: 0 auto; + display: block; +} + +#turn-count[data-update="0"] span.inning-bottom { + display: none; +} + +#turn-count[data-update="1"] span.inning-top { + display: none; +} + +#map-dialog { + border: 1px solid black; +} + +.map-placeholder { + position: absolute; +} + +@media (width >= 1800px) { + #record-sheet { + flex-direction: row; + /* gap: 2px; */ + } + + #record-sheet > div > p { + margin-top: 0; + } + + #record-sheet > div { + /* max-height: unset; */ + overflow-y: unset; + height: min-content; + } + + #record-sheet div:last-of-type { + margin-top: 0; + } + + #record-sheet > div:first-of-type > div { + /* margin-left: 1px; */ + margin-right: 1px; + } + + #record-sheet > div:last-of-type > div { + margin-left: 1px; + /* margin-right: 1px; */ + } +} diff --git a/public/assets/images/column.jpg b/public/assets/images/column.jpg Binary files differnew file mode 100644 index 0000000..df86414 --- /dev/null +++ b/public/assets/images/column.jpg diff --git a/public/assets/images/counter_grenade.jpg b/public/assets/images/counter_grenade.jpg Binary files differnew file mode 100644 index 0000000..45d25f0 --- /dev/null +++ b/public/assets/images/counter_grenade.jpg diff --git a/public/assets/images/counter_prone.jpg b/public/assets/images/counter_prone.jpg Binary files differnew file mode 100644 index 0000000..a8e9b46 --- /dev/null +++ b/public/assets/images/counter_prone.jpg diff --git a/public/assets/images/firing_arc_large.png b/public/assets/images/firing_arc_large.png Binary files differnew file mode 100644 index 0000000..c787537 --- /dev/null +++ b/public/assets/images/firing_arc_large.png diff --git a/public/assets/images/firing_arc_medium.png b/public/assets/images/firing_arc_medium.png Binary files differnew file mode 100644 index 0000000..6cc69ce --- /dev/null +++ b/public/assets/images/firing_arc_medium.png diff --git a/public/assets/images/firing_arc_small.png b/public/assets/images/firing_arc_small.png Binary files differnew file mode 100644 index 0000000..80afcb0 --- /dev/null +++ b/public/assets/images/firing_arc_small.png diff --git a/public/assets/images/icon_grenade.png b/public/assets/images/icon_grenade.png Binary files differnew file mode 100644 index 0000000..7642556 --- /dev/null +++ b/public/assets/images/icon_grenade.png diff --git a/public/assets/images/logo-davion.png b/public/assets/images/logo-davion.png Binary files differnew file mode 100644 index 0000000..c4f8b5f --- /dev/null +++ b/public/assets/images/logo-davion.png diff --git a/public/assets/images/logo-liao.png b/public/assets/images/logo-liao.png Binary files differnew file mode 100644 index 0000000..e441313 --- /dev/null +++ b/public/assets/images/logo-liao.png diff --git a/public/assets/images/map1.svg b/public/assets/images/map1.svg new file mode 100644 index 0000000..fe64a5e --- /dev/null +++ b/public/assets/images/map1.svg @@ -0,0 +1,1918 @@ +<?xml version="1.0" standalone="no"?> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" + "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> +<svg viewBox="-18 -150 2320 3360" xmlns="http://www.w3.org/2000/svg"> + <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; } + </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"/> + + <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" x="-18" y="-10" width="2320" height="3106"/> + + <g id="image-maps"> + <image id="map2" class="map-scans" href="scans/map2.jpg" width="2284" height="1518"/> + <image class="map-scans" href="row.jpg" width="2284" height="55" y="1505" /> + <image id="map3" class="map-scans" href="scans/map3.jpg" width="2284" height="1518"/> + </g> + + <g class="gameboard"> + <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="#t-1"/></g> + </g> + <g data-x="14"> + <g class="counter" data-allegiance="attacker" data-number="2"><use href="#t-2"/></g> + </g> + <g data-x="15"> + <g class="counter" data-allegiance="attacker" data-number="3"><use href="#t-3"/></g> + </g> + <g data-x="16"> + <g class="counter" data-allegiance="attacker" data-number="4"><use href="#t-4"/></g> + </g> + <g data-x="17"> + <g class="counter" data-allegiance="attacker" data-number="5"><use href="#t-5"/></g> + </g> + <g data-x="18"> + <g class="counter" data-allegiance="attacker" data-number="6"><use href="#t-6"/></g> + </g> + <g data-x="19"> + <g class="counter" data-allegiance="attacker" data-number="7"><use href="#t-7"/></g> + </g> + </g> + <g data-edge="south"> + <g data-x="13"> + <g class="counter" data-allegiance="defender" data-number="1"><use href="#t-1"/></g> + </g> + <g data-x="14"> + <g class="counter" data-allegiance="defender" data-number="2"><use href="#t-2"/></g> + </g> + <g data-x="15"> + <g class="counter" data-allegiance="defender" data-number="3"><use href="#t-3"/></g> + </g> + <g data-x="16"> + <g class="counter" data-allegiance="defender" data-number="4"><use href="#t-4"/></g> + </g> + <g data-x="17"> + <g class="counter" data-allegiance="defender" data-number="5"><use href="#t-5"/></g> + </g> + <g data-x="18"> + <g class="counter" data-allegiance="defender" data-number="6"><use href="#t-6"/></g> + </g> + <g data-x="19"> + <g class="counter" data-allegiance="defender" data-number="7"><use href="#t-7"/></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 href="../../map.js"></script> +</svg> diff --git a/public/assets/images/map2.svg b/public/assets/images/map2.svg new file mode 100644 index 0000000..542d8f0 --- /dev/null +++ b/public/assets/images/map2.svg @@ -0,0 +1,97 @@ +<?xml version="1.0" standalone="no"?> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" + "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> +<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"/> + <style> + #image-maps image { + transform: none; + } + + g[data-edge="north"] { --i: -2; } + g[data-edge="south"] { --i: 78; } + </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"/> + + <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> + + <image id="counter-prone" href="counter_prone.jpg" width="10"/> + <image id="counter-grenade" href="counter_grenade.jpg" width="10"/> + </defs> + + <rect id="background"/> + + <g id="image-maps"> + <image id="map2" class="map-scans" href="scans/map2.jpg" width="2284" height="1518"/> + <image class="map-scans" href="row.jpg" width="2284" height="55" y="1505" /> + <image id="map1" class="map-scans" href="scans/map1.jpg" width="2284" height="1518" y="1565"/> + <image class="map-scans" href="row.jpg" width="2284" height="55" y="3065" /> + <image id="map3" class="map-scans" href="scans/map3.jpg" width="2284" height="1518" y="3125"/> + </g> + + <g class="gameboard"> + <g id="firing-arcs"> + <g id="shapes"/> + <g id="lines"/> + </g> + <g class="start-locations"> + <g data-edge="north"> + <g data-x="13"> + <g class="counter" data-allegiance="attacker" data-number="1"><use href="#t-1"/></g> + </g> + <g data-x="14"> + <g class="counter" data-allegiance="attacker" data-number="2"><use href="#t-2"/></g> + </g> + <g data-x="15"> + <g class="counter" data-allegiance="attacker" data-number="3"><use href="#t-3"/></g> + </g> + <g data-x="16"> + <g class="counter" data-allegiance="attacker" data-number="4"><use href="#t-4"/></g> + </g> + <g data-x="17"> + <g class="counter" data-allegiance="attacker" data-number="5"><use href="#t-5"/></g> + </g> + <g data-x="18"> + <g class="counter" data-allegiance="attacker" data-number="6"><use href="#t-6"/></g> + </g> + <g data-x="19"> + <g class="counter" data-allegiance="attacker" data-number="7"><use href="#t-7"/></g> + </g> + </g> + <g data-edge="south"> + <g data-x="13"> + <g class="counter" data-allegiance="defender" data-number="1"><use href="#t-1"/></g> + </g> + <g data-x="14"> + <g class="counter" data-allegiance="defender" data-number="2"><use href="#t-2"/></g> + </g> + <g data-x="15"> + <g class="counter" data-allegiance="defender" data-number="3"><use href="#t-3"/></g> + </g> + <g data-x="16"> + <g class="counter" data-allegiance="defender" data-number="4"><use href="#t-4"/></g> + </g> + <g data-x="17"> + <g class="counter" data-allegiance="defender" data-number="5"><use href="#t-5"/></g> + </g> + <g data-x="18"> + <g class="counter" data-allegiance="defender" data-number="6"><use href="#t-6"/></g> + </g> + <g data-x="19"> + <g class="counter" data-allegiance="defender" data-number="7"><use href="#t-7"/></g> + </g> + </g> + </g> + <g class="grid"/> + </g> + <script href="../../map.js" data-cols="33" data-rows="77"></script> +</svg> diff --git a/public/assets/images/map3.svg b/public/assets/images/map3.svg new file mode 100644 index 0000000..9545a47 --- /dev/null +++ b/public/assets/images/map3.svg @@ -0,0 +1,94 @@ +<?xml version="1.0" standalone="no"?> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" + "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> +<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"/> + <style> + #image-maps image { + transform: translate(-10px, 0px); + } + + g[data-edge="north"] { --i: -2; } + g[data-edge="south"] { --i: 26; } + </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"/> + + <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> + + <image id="counter-prone" href="counter_prone.jpg" width="10"/> + <image id="counter-grenade" href="counter_grenade.jpg" width="10"/> + </defs> + + <rect id="background"/> + + <g id="image-maps"> + <image id="map4" class="map-scans" href="scans/map4.jpg" width="2284" height="1518"/> + <image id="map4" class="map-scans" href="column.jpg" width="24" height="1518" x="2268"/> + </g> + + <g class="gameboard"> + <g id="firing-arcs"> + <g id="shapes"/> + <g id="lines"/> + </g> + <g class="start-locations"> + <g data-edge="north"> + <g data-x="13"> + <g class="counter" data-allegiance="attacker" data-number="1"><use href="#t-1"/></g> + </g> + <g data-x="14"> + <g class="counter" data-allegiance="attacker" data-number="2"><use href="#t-2"/></g> + </g> + <g data-x="15"> + <g class="counter" data-allegiance="attacker" data-number="3"><use href="#t-3"/></g> + </g> + <g data-x="16"> + <g class="counter" data-allegiance="attacker" data-number="4"><use href="#t-4"/></g> + </g> + <g data-x="17"> + <g class="counter" data-allegiance="attacker" data-number="5"><use href="#t-5"/></g> + </g> + <g data-x="18"> + <g class="counter" data-allegiance="attacker" data-number="6"><use href="#t-6"/></g> + </g> + <g data-x="19"> + <g class="counter" data-allegiance="attacker" data-number="7"><use href="#t-7"/></g> + </g> + </g> + <g data-edge="south"> + <g data-x="13"> + <g class="counter" data-allegiance="defender" data-number="1"><use href="#t-1"/></g> + </g> + <g data-x="14"> + <g class="counter" data-allegiance="defender" data-number="2"><use href="#t-2"/></g> + </g> + <g data-x="15"> + <g class="counter" data-allegiance="defender" data-number="3"><use href="#t-3"/></g> + </g> + <g data-x="16"> + <g class="counter" data-allegiance="defender" data-number="4"><use href="#t-4"/></g> + </g> + <g data-x="17"> + <g class="counter" data-allegiance="defender" data-number="5"><use href="#t-5"/></g> + </g> + <g data-x="18"> + <g class="counter" data-allegiance="defender" data-number="6"><use href="#t-6"/></g> + </g> + <g data-x="19"> + <g class="counter" data-allegiance="defender" data-number="7"><use href="#t-7"/></g> + </g> + </g> + </g> + <g class="grid"/> + </g> + <script href="../../map.js" data-cols="33" data-rows="25"></script> +</svg> diff --git a/public/assets/images/map4.svg b/public/assets/images/map4.svg new file mode 100644 index 0000000..e0ce981 --- /dev/null +++ b/public/assets/images/map4.svg @@ -0,0 +1,49 @@ +<?xml version="1.0" standalone="no"?> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" + "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> +<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"/> + <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"/> + + <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> + + <image id="counter-prone" href="counter_prone.jpg" width="10"/> + <image id="counter-grenade" href="counter_grenade.jpg" width="10"/> + </defs> + + <rect id="background"/> + + <foreignObject width="100%" height="100%"> + <!-- + In the context of SVG embedded in an HTML document, the XHTML + namespace could be omitted, but it is mandatory in the + context of an SVG document + --> + + <div style="background-color: orange" xmlns="http://www.w3.org/1999/xhtml"> + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed mollis mollis + mi ut ultricies. Nullam magna ipsum, porta vel dui convallis, rutrum + imperdiet eros. Aliquam erat volutpat. + <img src="test.svg" width="10" height="10"/> + </div> + </foreignObject> + + <g class="gameboard"> + <g id="firing-arcs"> + <g id="shapes"/> + <g id="lines"/> + </g> + <g class="grid"/> + </g> + + <script href="../../map.js" data-cols="33" data-rows="25"></script> +</svg> diff --git a/public/assets/images/rendered_numbers.png b/public/assets/images/rendered_numbers.png Binary files differnew file mode 100644 index 0000000..8672434 --- /dev/null +++ b/public/assets/images/rendered_numbers.png diff --git a/public/assets/images/row.jpg b/public/assets/images/row.jpg Binary files differnew file mode 100644 index 0000000..110bb35 --- /dev/null +++ b/public/assets/images/row.jpg diff --git a/public/assets/images/scans/countersheet1.jpg b/public/assets/images/scans/countersheet1.jpg Binary files differnew file mode 100644 index 0000000..659070e --- /dev/null +++ b/public/assets/images/scans/countersheet1.jpg diff --git a/public/assets/images/scans/countersheet2.jpg b/public/assets/images/scans/countersheet2.jpg Binary files differnew file mode 100644 index 0000000..7a4d3ad --- /dev/null +++ b/public/assets/images/scans/countersheet2.jpg diff --git a/public/assets/images/scans/countersheet3.jpg b/public/assets/images/scans/countersheet3.jpg Binary files differnew file mode 100644 index 0000000..dfe4696 --- /dev/null +++ b/public/assets/images/scans/countersheet3.jpg diff --git a/public/assets/images/scans/countersheet4.jpg b/public/assets/images/scans/countersheet4.jpg Binary files differnew file mode 100644 index 0000000..028b216 --- /dev/null +++ b/public/assets/images/scans/countersheet4.jpg diff --git a/public/assets/images/scans/map1.jpg b/public/assets/images/scans/map1.jpg Binary files differnew file mode 100644 index 0000000..8f6bc46 --- /dev/null +++ b/public/assets/images/scans/map1.jpg diff --git a/public/assets/images/scans/map2.jpg b/public/assets/images/scans/map2.jpg Binary files differnew file mode 100644 index 0000000..82cd528 --- /dev/null +++ b/public/assets/images/scans/map2.jpg diff --git a/public/assets/images/scans/map3.jpg b/public/assets/images/scans/map3.jpg Binary files differnew file mode 100644 index 0000000..08232e4 --- /dev/null +++ b/public/assets/images/scans/map3.jpg diff --git a/public/assets/images/scans/map4.jpg b/public/assets/images/scans/map4.jpg Binary files differnew file mode 100644 index 0000000..8fa25dc --- /dev/null +++ b/public/assets/images/scans/map4.jpg diff --git a/public/assets/images/test.svg b/public/assets/images/test.svg new file mode 100644 index 0000000..0e257ce --- /dev/null +++ b/public/assets/images/test.svg @@ -0,0 +1,6 @@ +<?xml version="1.0" standalone="no"?> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" + "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> +<svg viewBox="-5 -5 10 10" xmlns="http://www.w3.org/2000/svg"> + <circle r="5" fill="purple"/> +</svg> |
