How do you render the grid without the hexes on the sides getting cut off?
maxp-hover opened this issue · 4 comments
Using the PIXI example in the readme, and modifying it a little to mess with the size/width/height. I can't manage to get the whole thing visible in the canvas, it always gets cut off:
If I reduce the size it starts to look better
but still cut off and besides, I don't really want it that small.
Any idea for how to fix this? I see the same issue in the JSFiddle linked from the readme.
I think the grid is just rendered partially outside the canvas. If you add an offset to render the whole grid a few pixels to the right, you should be fine. I've updated the fiddle (notice the add(10, 10)
).
I find myself writing a custom helper getDrawPoint
function which takes a hex and calls toPoint()
and then adds the desired offset for drawing. Using the Point's add
feature as described above definitely makes this simpler than how I was doing it before!
Although using this helper isn't much of a burden to implement, it would be nice to have a feature that allows specifying the point offset in the Hex factory so calling toPoint
will already apply the offset to the return value.
I guess I should just push all this logic into the extend feature of the factory 😃
I really enjoy this library and how flexible it is to use! Great work!
A bit late, but thanks @Corkle!
Closing this issue because it seems to've been resolved.