Digamos que eu tenho o arquivo SVG: <svg width="1024" height="768" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <text x='20' y='60' style="font-size: 60px">b</text> <text x='100' y='60' style="font-size:
eu amo o fonte do ícone Font Awesome e quero usá-la na maioria dos ícones do meu site, mas existem alguns ícones svg personalizados que eu precisaria além do que é oferecido. Notei que a versão .svg do Font Awesome é composta principalmente destes <glyph />elementos: ... <glyph...
Gostaria de definir uma cor de plano de fundo padrão para todo o documento SVG, para vermelho, por exemplo. <svg viewBox="0 0 500 600" style="background: red">/* content */</svg> A solução acima funciona, mas infelizmente a propriedade background do atributo style não é padrão:...
Existe uma maneira padrão de desenhar um arquivo SVG em uma tela HTML5? O Google Chrome suporta o carregamento do SVG como uma imagem (e simplesmente o uso drawImage), mas o console do desenvolvedor avisa queresource interpreted as image but transferred with MIME type image/svg+xml . Eu sei que...
Estou procurando usar um logotipo SVG para um site - para torná-lo ótimo em um design responsivo para todos os dispositivos. Mas, como existem problemas , desejo oferecer suporte ao maior número de dispositivos e navegadores possível. A velocidade da carga também é uma consideração importante....
É possível incorporar a marcação SVG em um componente ReactJS? render: function() { return ( <span> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmln ... </span> ); } Resultados no erro: Os atributos do espaço para nome não são suportados. ReactJSX...
Tenho alguns arquivos SVG que especificam widthe heighttambém viewboxassim: <svg width="576pt" height="432pt" viewBox="0 0 576 432" > ... mas como exibi-los no navegador em um tamanho que eu decido? Eu os quero menores e tentei: <object width="400"
Normalmente, para incluir a maioria dos meus ícones SVG que exigem um estilo simples, eu faço: <svg> <use xlink:href="/svg/svg-sprite#my-icon" /> </svg> Agora estou brincando com ReactJS ultimamente, avaliando-o como um possível componente em minha nova pilha de...
Fechadas. Esta pergunta não atende às diretrizes do Stack Overflow . Atualmente não está aceitando respostas. Quer melhorar esta questão? Atualize a pergunta para que esteja no tópico do Stack Overflow. Fechado há 2 anos . Melhore esta questão...
Estou tentando escolher a tecnologia certa para usar na atualização de um projeto que basicamente renderiza milhares de pontos em um gráfico com zoom e panorâmica. A implementação atual, usando Protovis, tem baixo desempenho. Confira aqui: http://www.planethunters.org/classify Existem cerca de...
Quais dimensões favicon, formatos de arquivo e tags de meta / link devem ser usados a partir de 2020? Isso inclui o ícone da apple, windows, android e outros dispositivos que as pessoas usam hoje. Eu uso o Opera e posso ver que ele suporta o formato SVG. É a melhor solução para usar SVG hoje em...
Enquanto processo meu XML, estou tentando copiar um arquivo SVG referenciado de um hrefatributo diretamente em meu HTML de saída com a seguinte linha: <xsl:copy-of copy-namespaces="yes" select="document(@href)"/> O copy-namespacesnão deve ser necessário, pois o valor padrão é "sim" de...
O objetivo é fazer com que o <svg>elemento seja expandido até o tamanho de seu contêiner pai, neste caso a <div>, não importa o quão grande ou pequeno esse contêiner seja. O código: <style> svg, #container{ height: 100%; width: 100%; } </style> <div...
Estou trabalhando em um projeto da web que envolve um mapa gerado dinamicamente dos EUA, colorindo diferentes estados com base em um conjunto de dados. Este arquivo SVG me dá um bom mapa em branco dos EUA e é muito fácil mudar a cor de cada estado. A dificuldade é que os navegadores IE não...
Em typescript(*.tsx)arquivos, não consigo importar o arquivo svg com esta declaração: import logo from './logo.svg'; Transpiler diz: [ts] cannot find module './logo.svg'. Meu arquivo svg é justo <svg>...</svg>. Mas no .jsarquivo posso importá-lo sem problemas com exatamente a mesma...
Acabei de encontrar um problema muito estranho que só aparece no Safari 10. Tenho cartas de jogar, imagens SVG, que às vezes são giradas usando transform:rotate(xdeg). O cartão que estou usando tem um padrão de bloco vermelho. Quando não é girado ou girado em ângulos retos, ou seja, 90, 180, 270,...
Eu gostaria de exibir um <text>em SVG que iria quebrar a linha automaticamente no contêiner <rect>da mesma maneira que o texto HTML preenche os <div>elementos. Existe uma forma de fazer isso? Não quero posicionar as linhas esparsamente usando
Quando um SVG é incluído diretamente em um documento usando a <svg>tag, você pode aplicar estilos CSS ao SVG por meio da folha de estilo do documento. No entanto, estou tentando aplicar um estilo a um SVG que está incorporado (usando a <object>tag). É possível usar algo como o código a...
Então aqui está o que eu tenho: <path class="..." onmousemove="show_tooltip(event,'very long text \\\n I would like to linebreak')" onmouseout="hide_tooltip()" d="..."/> <rect class="tooltip_bg" id="tooltip_bg" ... /> <text class="tooltip" id="tooltip"
Qual é a diferença entre os atributos x e dx de svg (ou y e dy)? Quando seria o momento adequado para usar o atributo de deslocamento do eixo (dx) em vez do atributo de localização (x)? Por exemplo, tenho notado muitos exemplos de d3 fazendo algo assim chart.append("text") .attr("x", 0)...