How to create in HTML5 canvas viewport? something like for tile maps.
You didn't say whether you're using the 2d context or WebGL; I'll assume that you're using 2d context.
You can use the 2d context object's transformation methods to set the translation.
Normally this means that at the beginning of rendering each frame, you reset the transformation, with a call such as:
Then you transform based on your current viewport, such as:
This assumes that you have variables offsetX and offsetY which contain the coordinates of the top-left corner of the viewport.
Then you can just render all objects normally using "World coordinates" and have the outcome you expect.
Culling is left as an exercise for the reader :)
Taking a wild stab at what you want I will give you a few ways of doing this:
Pure CSS way... (simplified)
The JS way