Gráficos vectoriales escalables (SVG) es un formato de gráficos vectoriales bidimensionales basado en XML que también se puede utilizar en HTML. No agregue esta etiqueta solo porque su proyecto usa SVG. En su lugar, agregue la etiqueta si su pregunta es sobre SVG o está estrechamente relacionada con ella, como cómo lograr algo con SVG.

svg...

Tenemos un problema extraño con nuestros íconos SVG en nuestro menú móvil. Parecen muy grandes en la versión móvil, aunque se establecen en 1.6em. Vaya aquí, abra el menú de hamburguesas y haga clic en el menú desplegable "Comprar ahora", verá el tamaño de los iconos Probamos el siguiente CSS en el ....
18 ago. 2020 a las 17:40
Tengo una URL de imagen que es básicamente una imagen svg. data:image/svg+xml;charset=utf8,<?xml%20version="1.0"%20encoding="utf-8"?><!DOCTYPE%20svg%20PUBLIC%20"-//W3C//DTD%20SVG%201.1//EN"%20"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg%20xmlns="http://www.w3.org/2000/svg"%20width="14"%20....
10 ago. 2020 a las 10:54
Estoy tratando de aplicar múltiples efectos de sombra, cada uno con un color diferente usando SVG, puedo colocar los elementos perfectamente pero no puedo averiguar cómo colorearlos de forma independiente. Lo siguiente me lleva al 90% allí, pero ambas sombras son del mismo color: <svg className=....
7 ago. 2020 a las 14:45
Lo que tengo: #poly-1:hover { stroke: green; } <svg width="1000" height="500" id="chart-main-canvas" style="background-color: bisque; z-index:5000;"> <path id="poly-1" d="M 5,10 C 24,88 60.99999999999998,322 100,400 C 139,478 149,470 200,400 C 251,330 295,30.000000000000007 355,50 C 415....
7 ago. 2020 a las 12:05
¿Es posible cambiar el color svg path (¡no el fondo!) Si el svg se carga desde un archivo local. .status-icon1 { width: 48px; height: 48px; display: inline-block; background-color: green; mask: url(https://gitlab.com/gitlab-org/gitlab-svgs/blob/main/sprite_icons/status_success.svg) no-re....
6 ago. 2020 a las 12:04
¡Mi svg parece estar atascado en la parte inferior derecha de la pantalla sin importar lo que haga! quiero centrar su alto y ancho en el medio de la ventana gráfica, por favor encuentre debajo el código HTML y CSS con imagen body { display: flex; margin-right: 0; background-color: #000; ....
6 ago. 2020 a las 04:30
Estoy tratando de dividir este svg para una mayor animación en 3 partes: -mug -steam1 -steam2, pero no puedo encontrar la ruta correcta. código antes: <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="mug-hot" class="svg-inline--fa fa-mug-hot fa-w-16" role="img" xmlns="http://....
5 ago. 2020 a las 19:43
Básicamente, quiero que mi logotipo SVG se ajuste a un contenedor div que hice. Pero cuando trato de cambiar el tamaño con width:100%; y height:100% para que pueda mostrarse completamente en el tamaño del contenedor div, simplemente desaparece. El logotipo SVG debe estar en el contenedor azul. *{ ....
5 ago. 2020 a las 02:12
Estoy intentando utilizar kristerkari / react-native-svg-transformer, pero Recibo el siguiente error después de ejecutar el metro: error: assets/menu.svg: /user/Projects/mobile/assets/menu.svg: Namespace tags are not supported by default. React's JSX doesn't support namespace tags. You can set `thro....
4 ago. 2020 a las 12:56
Estoy haciendo una animación cuyo objetivo es cambiar el xlink:href dentro de un SVG. (esto es para cambiar una forma) y cambiar de clase con respecto a su posición en el interior. Este es mi SVG <svg viewBox="-20 -20 600 200" id="main"> <defs id="test"> <rect width="80" height="80" id="circle....
1 ago. 2020 a las 11:32
Actualmente estoy diseñando un logo que tiene un fondo degradado animado. Requisitos: La imagen de la máscara debe ser jpg o png. El elemento que se está enmascarando debe ser preferiblemente un <div> El degradado debe ser CSS y preferiblemente provenir del fondo <div> La máscara debería verse así....
30 jul. 2020 a las 06:35
Me gustaría rotar un círculo SVG mientras evito que los otros elementos roten Cuando intento rotar el círculo (color blanco) usando rotateZ (15deg), esto es lo que obtuve: Este es mi progreso hasta ahora: https://jsfiddle.net/41hrnojs/ <svg viewBox="0 0 1400 900" style="outline:1px solid red;"> ....
28 jul. 2020 a las 12:49
A continuación se muestra una imagen de lo que estoy tratando de hacer. Agrega una forma a la etiqueta g más interna del svg. Lo que he hecho hasta ahora: let svg = document.querySelector('svg'); let g = svg.getElementsByClassName('srd-default-link'); let shape = document.createElement....
28 jul. 2020 a las 10:44
Estoy tratando de obtener un mensaje de texto de una etiqueta de clase usando selenio y llegué a un callejón sin salida. Todos los nombres de las clases son la misma "fila de leyenda" pero solo necesito la tercera, la que tiene el texto "1.09TB". Intenté encontrar el elemento por xpath y no tuve sue....
28 jul. 2020 a las 09:55
He hecho un mapa svg con filtro. Me gustaría resaltar las rutas o rectificaciones de svg cuando el elemento de las listas de filtros al pasar el mouse. Uso la función jQuery 'mousenter, mouseleave' pero en 'mouseleave' la clase agregada no se ha eliminado y las rutas svg permanecen resaltadas. jQu....
27 jul. 2020 a las 17:59
Tengo un componente React que incluye un selector de color y un SVG con regiones distintas que se pueden completar independientemente el uno del otro. Mi objetivo aquí es poder hacer clic en un color en el selector de color y luego hacer clic en una región del SVG donde luego se rellenará con el col....
25 jul. 2020 a las 00:13
¿Cómo hago que document.elementsFromPoint (x, y) solo devuelva elementos dentro de SVG? ¿Cómo obtengo una lista de elementos SVG solamente y aplico cambios de desplazamiento solo a esos elementos SVG? Finalmente, esto se superpondrá en un SVG muy grande con miles de puntos. ¿Existe una forma más ef....
24 jul. 2020 a las 22:00
elem = document.querySelectorAll("path"); function task(i) { setTimeout(function() { elem[i].animate({fill: 'green'}, { // timing options duration: 150, iterations: 1 }); }, 150*i); } for(var i=0;i<8;i++){ task(i); } <svg id="loader" width="254" height="254" viewBox="0 0 254....
24 jul. 2020 a las 21:08
Todo lo que encontré fue al revés, p. "cómo escalar el texto para que se ajuste a SVG". Pero quiero lograr lo contrario: SVG en mi html: <svg class="text" xmlns='http://www.w3.org/2000/svg' stroke='black' fill='none'> <text> <tspan>Some Text</tspan> </text> </svg> Css: svg.text { font-siz....
23 jul. 2020 a las 17:56
Quiero agregar un fondo SVG a una sección: section:before { content: ''; position: absolute; right: 0; bottom: 0; width: 100%; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1759' height='487'> <path fill-rule='evenodd' d='M.....
23 jul. 2020 a las 11:55
Tengo un icono de svg y quiero colorearlo con más de un color al pasar el mouse. En este ejemplo, me gustaría hacer que solo el contorno positivo muestre un color rojo al pasar el mouse, ya que el resto del icono permanece negro. Aquí está el ejemplo: .svg_icons{ fill:lightgrey; transition:0.3s; c....
22 jul. 2020 a las 17:07
Estoy tratando de animar una imagen .svg (versión .png vinculada a continuación), específicamente el ECG en la parte superior derecha. Tengo la animación de JavaScript que quiero allí, pero no estoy seguro de cómo obtenerla. SVG: <svg xmlns="http://www.w3.org/2000/svg" width="550" height="500" view....
22 jul. 2020 a las 10:07
Tengo una máscara svg que determina los agujeros en forma rectangular. Detrás de la máscara svg tengo algunos elementos en los que se puede hacer clic y me gustaría pasarles eventos, pero solo a través de agujeros. He experimentado con los valores de pointer-events, pero solo puedo hacer una máscara....
21 jul. 2020 a las 00:30
Así que convertí un boceto PNG de un modelo de moda a un SVG porque hacía que las líneas se vieran mucho más limpias y definidas. El objetivo final es que el usuario haga clic en un color y complete las prendas separadas con el color seleccionado. Mi único problema es que realmente no puedo entender....
svg
20 jul. 2020 a las 19:43
Tengo un archivo SVG que importo en mi página web React. El problema es que el SVG mostrado tiene algunos de sus colores incorrectos. Como puede ver en la página web, hay 3 SVG. 2 de ellos se muestran con colores incorrectos. Pero el primero tiene colores originales. Aunque los 3 SVG se importan y ....
20 jul. 2020 a las 18:45