Indie-Resource.com

I'm attempting to make an isometric hex-based map using HTML5 Canvas. I want it to be confined to a div in the center of the screen and be a viewport on a much bigger map, so the player can drag it around within that window and zoom in/out. I also want each hex to be clickable so later on I can do actions when the player clicks a given hex.

Can anyone point me to a good tutorial to get me started on something like that?

Mozilla has a nice one here. Also, you can check out this site. That should be enough to get you started

Of course, Canvas isn't the answer to all browser-based game development. If you want to easily manage on-screen clicks through Javascript-like click events, you may want to go with a pre-Canvas DOM solution such as gameQuery.

Thanks, Jack. I'd seen the html5canvastutorial site before - they have some nice stuff there.

I'm not familiar with gameQuery - is it easy to work with?

It is in the style of jQuery (it is actually a jQuery plugin), so if you know jQuery, it will feel quite natural. It is a DOM-based game engine that started right before the big explosion of HTML5. So each item in the game will actually be a DOM-based item instead of the entire screen being one bitmap context, which is the way HTML5 canvas works. It can make certain game types easier to work with