BDS Software

Hex vs. Square - Page 15



Click the Hexes


Click the hexes and see the results to the right:

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

What this involves is first placing a canvas having the Color IDs image on the screen, then overlaying that canvas with another canvas having the blank black-on-white hexmap image.

For this to work as expected, the two canvases have to be in identical spatial registration at all times (i.e. they must never move with respect to each other, even during scrolling and/or resizing of the overall web page).

This, in turn, requires them to be styled with "position: absolute;" which then further requires background spacing to ensure that the absolute positioned canvases do not overlay or overlap any of the web page's other visible text, images, or features.

This will be best understood by examining the commented page code itself. Just right-click anywhere on the web page, EXCEPT on the hexmap image itself, and then click on "View Page Source".


-----

Of course, a blank map isn't much more exciting than the Color IDs image it covers up. For something a little more interesting, please continue on to the Next Page.




                                                                                                                                                                M.D.J. 2022/08/27