O girar A função SVG (Scalable Vector Graphics) permite que você especifique um ângulo para o qual deseja girar uma determinada imagem. Ele funciona para virar a imagem em qualquer direção. O World Wide Web Consortium (W3C) define SVG como “uma linguagem baseada em XML para descrever vetores bidimensionais e gráficos vetoriais / raster mistos. O conteúdo SVG pode ser estilizado e escalonado para exibições diferentes resoluções e podem ser visualizados de forma independente, combinados com conteúdo HTML ou incorporados usando namespaces XML em outras linguagens XML. O SVG também oferece suporte a alterações dinâmicas; o script pode ser usado para criar documentos interativos e as animações podem ser executadas usando recursos de animação declarativa ou usando o script. ”
Sobre Rodar
O girar a função tem tudo a ver com o ângulo do gráfico. Ao projetar uma imagem SVG, você cria um modelo estático que provavelmente ficará em um ângulo tradicional. Por exemplo, um quadrado terá dois lados ao longo do eixo X e dois ao longo do eixo Y. Com girar, você pode transformar esse mesmo quadrado em um diamante. Com apenas aquele efeito, você passou de uma caixa típica (um elemento comum em sites) para um diamante, o que adiciona uma variedade visual interessante a um design. Girar também faz parte das capacidades de animação do SVG. Por exemplo, um círculo pode girar constantemente conforme é exibido. Esse movimento pode concentrar a experiência do visitante em áreas ou elementos-chave de um design.
Girar assume que um ponto na imagem permanecerá fixo. Imagine um pedaço de papel preso a um papelão com um alfinete; a localização do pino é o local fixo. Se você pegar uma borda do papel e girá-la, o alfinete não se move, mas o retângulo gira. É assim que o girar função funciona.
Rotate Syntax
Usar girar, especifique o ângulo da curva e as coordenadas da área fixa: transform = “rotate (45,100,100)”
Neste código, o ângulo de rotação é de 45 graus. O ponto central vem a seguir; neste exemplo, suas coordenadas são 100 no eixo xe 100 no eixo y. Se você não inserir as coordenadas da posição central, o padrão será 0,0. No exemplo abaixo, o ângulo ainda é de 45 graus, mas o ponto central não foi estabelecido; portanto, o padrão será 0,0. transformar = “girar (45)”
Por padrão, o ângulo vai para o lado direito do gráfico. Para girar a forma na direção oposta, você usa um sinal de menos para especificar um valor negativo: transform = “rotate (-45)”
Uma rotação de 45 graus é um quarto de volta, visto que os ângulos são baseados em um círculo de 360 graus. Se você listar a revolução como 360, a imagem não mudará porque você a estará girando em um círculo completo. Nesse caminho, girar dá a você controle total sobre os ângulos de suas imagens.
