| index : btroops | |
| Virtual board game-aid for BattleTroops, an infantry combat simulator wargame published by FASA in 1989. |
| aboutsummaryrefslogtreecommitdiff |
diff options
| author | Catalin Mititiuc <Catalin.Mititiuc@gmail.com> | 2024-03-17 18:50:47 -0700 |
|---|---|---|
| committer | Catalin Mititiuc <Catalin.Mititiuc@gmail.com> | 2024-03-17 18:50:47 -0700 |
| commit | 3a1a981506da2c214596942780e493d1142d150f (patch) | |
| tree | 3685fd327f36ad5bbab4beb10f84054ad3d3acd6 | |
| parent | 50372d16a9db19bdabe08d5b6315e0dd52e926fd (diff) | |
Add map image
| -rw-r--r-- | index.html | 22 | ||||
| -rwxr-xr-x | map1.png | bin | 0 -> 3084712 bytes |
2 files changed, 16 insertions, 6 deletions
@@ -5,13 +5,22 @@ background-color: darkgray; } + body { + margin: 0; + } + circle { fill: red; } + + image { + transform: scale(3.41); + opacity: 0.33; + } </style> </head> <body> - <svg viewbox="-50 -50 3450 2450" xmlns="http://www.w3.org/2000/svg" stroke-width="20"> + <svg viewbox="-100 -100 3450 2400" xmlns="http://www.w3.org/2000/svg" stroke-width="20"> <defs> <pattern id="inch-mark" x="0" y="0" width="2in" height="2in" patternUnits="userSpaceOnUse"> <rect x="0" y="0" width="1in" height="2in" fill="black" /> @@ -21,18 +30,19 @@ <pattern id="vert" href="#inch-mark" patternTransform="rotate(90)" /> </defs> - <line x1="0" y1="0" x2="34in" y2="0" stroke="url(#inch-mark)" /> - <line x1="0" y1="0" x2="0" y2="22in" stroke="url(#vert)" /> + <line x1="0" y1="-0.25in" x2="34in" y2="-0.25in" stroke="url(#inch-mark)" /> + <line x1="-0.25in" y1="0" x2="-0.25in" y2="22in" stroke="url(#vert)" /> <rect x="0" y="0" width="34in" height="22in" fill="Gainsboro" /> + <image href="map1.png" height="6.428in" width="9.971in" /> </svg> <script> var svgns = "http://www.w3.org/2000/svg", svg = document.querySelector('svg'); - var columnCount = 34, + var columnCount = 33, rowCount = 25, - pointDistanceInInches = 1.015; + pointDistanceInInches = 1.05; var isOdd = n => n % 2 === 1; @@ -46,7 +56,7 @@ pointCoords.forEach((row, index) => row.forEach(([x, y]) => { var circle = document.createElementNS(svgns, 'circle'), - calcY = Math.sqrt(3) * pointDistanceInInches / 2; + calcY = Math.sqrt(3) * pointDistanceInInches / 2 * 0.93; if (isOdd(index)) { var alternatingOffset = pointDistanceInInches / 2; diff --git a/map1.png b/map1.png Binary files differnew file mode 100755 index 0000000..6e9ba2e --- /dev/null +++ b/map1.png |
