Perguntas com a marcação «svg»

É 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 não é XML. Qual é a maneira mais leve de fazer isso? …

127 javascript  svg  reactjs 

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 converter um PDF para SVG. No entanto, o que …

114 pdf  svg 

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 desenvolvimento de front-end, no entanto, percebi que em sua lista de tags / …

114 svg  sprite  reactjs 

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" data="image.svg"></object> mas então recebo barras de rolagem visíveis. Funciona se eu alterar os …

114 html  svg 

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 2.000 pontos quando totalmente reduzido. Tente usar as alças na …

114 html  canvas  svg  d3.js  kineticjs 

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 qualquer maneira, mas eu o adicionei para evitar dúvidas sobre se …

113 html  xml  svg  xslt-1.0  xslt-2.0 

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 …

113 html  svg  png  favicon 

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 id="container"> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" > <rect x="0" …

112 css  html  svg  responsive-design 

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 é …

111 php  svg  imagemagick  jpeg  gd2 

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, …

109 html  css  svg  safari 

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 instrução de importação. Suponho que tenha algo a ver com o …

109 typescript  svg 

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 <tspan>s.

108 xml  text  svg  word-wrap 

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" ...>Tooltip</text> <script> <![CDATA[ function show_tooltip(e,text) { var tt = document.getElementById('tooltip'); var bg = document.getElementById('tooltip_bg'); // set position ... tt.textContent=text; bg.setAttribute('width',tt.getBBox().width+10); bg.setAttribute('height',tt.getBBox().height+6); // …

107 javascript  svg  newline  line-breaks 

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 …

107 html  css  svg 

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", …

106 svg  d3.js