Estou procurando criar uma imagem de fundo SVG para uma página da Web usando hexágonos regulares em um padrão de mosaico semelhante à imagem abaixo. No entanto, preciso que os hexágonos se interconectem para que eu possa usar o:
background-image: url("path-to-hex.svg");Padrão CSS. Eu gostaria de fazer isso no Inkscape. Não tenho certeza de como "cortar" o padrão em blocos. Como eu começaria a fazer isso?
EDIT
O resultado saiu muito bom!
Respostas:
Com um pouco de truques de operação booleana, esse é um processo bastante fácil.
Basta pegar um conjunto de hexágonos que você possui, criar um retângulo que corresponda ao laranja que eu tenho na imagem acima (verifique se os cantos se encaixam nos pontos apropriados nos hexágonos) e, em seguida, use a ferramenta de interseção para obter livre de tudo fora do retângulo. Isso deve deixar você com um padrão inclinável.
Edit: Pelo comentário de horatio (boa ligação!), Achei que deveria explicar como me acomodei naquele retângulo em particular. Ao criar um bloco, é necessário que cada parte do seu padrão apareça pelo menos uma vez no referido bloco (e, idealmente, não mais que uma vez). Com esse padrão, observei se havia pontos recorrentes no eixo x ou y; felizmente para mim, os hexágonos não estão sentados em um ângulo estranho, então isso tornou as coisas uma tarefa relativamente fácil.
No eixo X, peguei dois hexágonos alinhados. Estes seriam o início e o fim do padrão, horizontalmente. Em seguida, selecionei um ponto correspondente de cada um (neste caso, o ponto mais à esquerda). Isso marcaria a largura exata do retângulo de recorte para o padrão. Em seguida, fiz o mesmo verticalmente, usando os pontos que já escolhi para a largura como os cantos superiores do retângulo de recorte do padrão. Depois de encontrar os pontos inferiores correspondentes, o retângulo de recorte foi definido.
Você pode usar esta técnica em qualquer número de formas. Você também pode usá-lo em hexágonos (ou outras formas) em ângulo, mas lembre-se de que o ladrilho ficará substancialmente maior, dependendo do ângulo.
fonte