Canvas Layers

[OldRod]

Can someone point me to a good tutorial on HTML5 canvas layers? I just can't seem to get them working.

I have a map image on one layer (the background), then a hex grid on the other one and I want to have it visible over the map layer.

I can do the map, or I can do the hex grid, but I can't get both to show up. I have been setting the z-index property in the stylesheet, but all that shows up is the map image. The code that draws the map is being called (I have an alert pop up to verify that) but the grid never shows up unless the map isn't drawn.

So if anyone has an idiot's guide to HTML5 canvas layers, please point me to it

[Ark]

Not sure if following but why don't you just draw the map first then draw the hex grid, or is it necessary for the both to be in separate canvas?

[OldRod]

No, it's not necessary for them to be separate, but I thought they had to be. The map is an image I am loading and displaying from a file. The grid is drawn dynamically (though I may change it to an image later if it impacts performance).

When I first tried it without layers, the grid didn't show up either - that's what got me thinking I needed layers.

[OldRod]

OK, I see what I'm doing wrong.

I was displaying the image in the onLoad event. I need to call my grid drawing from there also it looks like.