debrief / debrief-icons

Set of graphic icons, for use across Debrief applications
https://debrief-icons.herokuapp.com/svg/index.html
Creative Commons Zero v1.0 Universal
0 stars 3 forks source link

SVG icons need to be centered in their viewport #54

Closed IanMayo closed 5 years ago

IanMayo commented 5 years ago

I'm re-using these icons in another app. But, the renderer (d3) is struggling to put them in the correct location.

The SVG is centred in the correct place, but some icons aren't centered in the SVG file: image

Here are the icons with shaded backgrounds, so we can see their bounds: https://debrief-icons.herokuapp.com/svg/index_borders.html

Actually, it just looks like floating_mine and bottomed_mine are the only two that need adjusting.

Can you edit these two icons so that the shape is centered within the SVG file?

hlaposhka commented 5 years ago

Yes, of course. Initially centering was on the red dot. Leave it in the center of the icon or in the center of the file?

IanMayo commented 5 years ago

The red dot will stay in the same place on the icon. But, the bottom of the file will be trimmed, so that the whole shape is in the centre of the file. Does that make sense?

hlaposhka commented 5 years ago

That is, it is not necessary to preserve the proportion of the file? Then I can cut file

IanMayo commented 5 years ago

Oh, I forgot that they were already square.

In that case, it would be ok to move the icon down into the centre of the file (with the red dot moving down, too).

IanMayo commented 5 years ago

Done.