How do you render the grid without the hexes on the sides getting cut off?

[maxp-hover]

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.

[flauwekeul]

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)).

[Corkle]

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.

[Corkle]

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!

[flauwekeul]

A bit late, but thanks @Corkle!

Closing this issue because it seems to've been resolved.