Author Topic: Help wanted: drawing map tiles on HTML5 canvas  (Read 3545 times)

0 Members and 1 Guest are viewing this topic.

Offline yakra

  • TM Collaborator
  • Hero Member
  • *****
  • Posts: 4234
  • Last Login:February 13, 2024, 07:19:36 pm
  • I like C++
Help wanted: drawing map tiles on HTML5 canvas
« on: July 04, 2018, 12:32:34 pm »
I've been experimenting with drawing OSM map tiles on the HTML5 canvas, the idea being to implement it in tmg2html once I get it working.

Here's where progress is at so far:
http://yakra.teresco.org/tmtools_demos/tile/NS-tile.htm (118.8 k)
http://yakra.teresco.org/tmtools_demos/tile/RI-tile.htm (13.1 k)
The tiles do not display when viewing an area/zoom level that hasn't been viewed before. This includes when the map is first loaded.
To get the tiles to display, you need to redraw the map at an already-viewed area/zoom level. There are several ways to do this:
• Pan the map
• Zoom out & back in, or vice versa
• Click Render or NullXform, or type 'n' or 'N'
Reset the map to its initial state, via the button or typing 'r' or 'R'

No big surprises here; I'm drawing the images before they're fully loaded.
What I want to do is use image.onload. It's there in the code; just uncomment lines 126-128 & comment out line 131, and away we go.
But it doesn't work. Nothing loads. Ever. Same results if I try different, non-OSM, tilesets.
And I've gotten image.onload to work just fine on several other occasions when using code from various references/tutorials/blogs/etc. around the web.

What am I doing wrong?
« Last Edit: July 10, 2018, 09:38:36 pm by yakra »
Sri Syadasti Syadavaktavya Syadasti Syannasti Syadasti Cavaktavyasca Syadasti Syannasti Syadavatavyasca Syadasti Syannasti Syadavaktavyasca