Skip to content
This repository has been archived by the owner on Oct 14, 2024. It is now read-only.

Hexa Isogrids not filling entire space #102

Open
ljwagerfield opened this issue Jun 30, 2017 · 5 comments
Open

Hexa Isogrids not filling entire space #102

ljwagerfield opened this issue Jun 30, 2017 · 5 comments

Comments

@ljwagerfield
Copy link

Firstly thank you as this is a great service (so please keep up the great work!).

I'm using the "hexa isogrids" as placeholder for profile images, but I've noticed they don't fill the entire canvas.

E.g. if I put a 32x32 hexa isogrid on my page, after measuring the resulting pixels in photoshop, it's more like 27x30.

Any ideas? Would this be an easy one to fix?

@santiaago
Copy link
Member

Hi @ljwagerfield thanks for the feedback,

I am not sure I understand, could you send me a link to an example (http://www.tinygraphs.com/labs/isogrids/...) of that scenario?

I think you should be able to define the size you want using the size parameter.
example:
/labs/isogrids/hexa/tinygraphs?theme=frogideas&numcolors=4&size=64
http://www.tinygraphs.com/labs/isogrids/hexa/tinygraphs?theme=frogideas&numcolors=4&size=64

It is an svg under the hood so it should keep the measures:

image

@ljwagerfield
Copy link
Author

ljwagerfield commented Jul 1, 2017

Your screenshot actually demonstrates it quite well: there's blank padding around the coloured parts of the SVG, on every edge other than "top". E.g. for the 64x64 example you've given, the effective visual size appears more like 54x60.

It seems minor, but when you're using these as image placeholders (for what will eventually be images that are exactly 64x64px) several pixels of internal whitespace makes quite a difference -- it makes the design you're working on look like components haven't been aligned correctly, even though they have.

@santiaago
Copy link
Member

I see what you mean, thanks. Let me see what I can do

@nytopop
Copy link

nytopop commented Dec 1, 2017

What's happening here is integer truncation. Space invaders does the same thing 😄.

See here, if size is 128, quadrantSize should == 11.636363... but it gets truncated to 11 as it's an int. Thus only sizes evenly divisible by 11 will display correctly.

I believe the others have a similar issue with bounding box calculations.

@ajstarks
Copy link

ajstarks commented Dec 2, 2017

You can try the floating point version of SVGo:

import "github.com/ajstarks/svgo/float"

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants