Preguntas con la etiqueta [svg]
Los Gráficos Vectoriales Redimensionables (del inglés Scalable Vector Graphics) o SVG son una especificación para describir gráficos vectoriales bidimensionales, tanto estáticos como animados (estos últimos con ayuda de SMIL), en formato XML.
161
preguntas
1
voto
1
respuesta
42
vistas
¿Cómo puedo cambiar el color de un archivo SVG con filter para que sea un color en especifico?
Buen día a todos, tengo un problema y es que me gustaría cambiar el color de un archivo SVG, pero como no encuentro el valor del color directamente en el SVG, y se me ocurrió cambiarlo con los estilos ...
2
votos
1
respuesta
40
vistas
Deformar ancho y alto de una imagen SVG
Tengo el siguiente problema.
Tengo una etiqueta SVG donde creo un polígono con su viewBox definido. La cuestión es que al introducirlo de esta manera, no me deja definirle el ancho y alto en css, la ...
0
votos
1
respuesta
46
vistas
Relacionar partes de un mapa SVG con una tabla
Quiero saber si es posible la interacción de que al momento de que el evento hover ocurra en la tabla también afecte a ese mismo municipio en el mapa o alguna forma de dar esa impresión.
la tabla la ...
0
votos
0
respuestas
27
vistas
Como añadir font-family a un svg en un servidor sin topografias? Node JS backend
Tengo un problema a la hora de generar SVGs con texto. En un servicio backend alojado en GCP con kubernetes, el servidor no dispone de tipologías de página (o al menos eso creo).
Por ello, necesito ...
0
votos
0
respuestas
44
vistas
imagenes svg en fpdf
me han pasado un código de una aplicación donde una de sus funciones es la generación de un pdf. Para ello usa lo siguiente from fpdf import FPDF. En el momento de su programación se que daba error ...
0
votos
1
respuesta
214
vistas
Cómo superponer un texto a un svg en html
Estoy practicando HTML+CSS y tengo la siguiente duda:
¿Cómo superponer un texto a un svg haciendo uso de css pero sin depender de un position absolute hacia el top de la página?
O sea, es muy fácil ...
2
votos
2
respuestas
177
vistas
¿cómo aplicar estilos sobre elementos svg?
tengo la siguiente imagen en svg:
<svg width="17" height="16" viewBox="0 0 17 16" xmlns="http://www.w3.org/2000/svg">
<path d="M7.75028 5....
2
votos
2
respuestas
436
vistas
Como puedo transformar un codigo svg en una imagen con php?
estoy realizando un proyecto donde creo un carnet con la liberia Fabric, de alli lo exporto en forma de SVG y me da el siguiente codigo:
'<svg xmlns="http://www.w3.org/2000/svg" xmlns:...
0
votos
1
respuesta
139
vistas
Aplicar fuente en un SVG de un Componente React
Estoy teniendo un inconveniente con un svg y es que quiero aplicar una fuente a las letras, como se espera funciona bien si tengo la fuente instalada en el PC obviamente, pero quiero agregar dicha ...
1
voto
1
respuesta
1k
vistas
¿Cómo cambiar el color de un svg por medio del hover de otro elemento?
¡¡Hola a todos!!
He tenido una dificultad al crearle una transición de color a un svg cuando posiciono el cursor del ratón por encima del link. El resultado que busco es que el color del icono cambie ...
1
voto
0
respuestas
46
vistas
SVG no se redimensiona en Firefox
Estoy desarrollando una web en react, en una parte tengo un Box con una imagen en formato svg con un width específico. En Chrome me funciona bien, la imagen se redimensiona al width asignado, pero en ...
0
votos
2
respuestas
126
vistas
python selenium webdrive con un svg cerrar banner
website https://www.radarbox.com/@35.38300,-77.41146,z4
los abre con selenium import webdriver todo bien
from selenium import webdriver
driver = webdriver.Chrome('chromedriver')
driver.implicitly_wait(...
0
votos
1
respuesta
160
vistas
¿Cómo cambio el valor xlink:title de una etiqueta <a> que contiene un <path> en JS?
Necesito cambiar el xlink:title de una etiqueta <a>, que contiene un <path>, de acuerdo al valor de una variable, por ejemplo:
const titulo = "Título Modificado";
<a xlink:...
0
votos
0
respuestas
79
vistas
Optimizar código de archivo SVG para la web
Vectoricé una imagen en Illustrator y la estoy exportando como .SVG, hasta aquí todo bien. El problema es que el código me queda muy extenso, tiene mas de doce mil lineas...Estuve leyendo otras ...
0
votos
1
respuesta
96
vistas
Aumentar velocidad a cada circulo por separado
Hola tengo el siguiente problema, necesito aumentar la velocidad a la bolas por separado pero no encuentro la solución:
window.onload = () =>{
setInterval(NBolas,30);
array = document....
0
votos
1
respuesta
411
vistas
Añadir hipervínculo a un archivo SVG fuera de HTML
¿Cuál sería la forma correcta de poder añadir hipervínculos a diferentes elementos en un archivo SVG que no sea dentro del html?
He vectorizado una imagen en illustrator y la exporté como SVG. Sería ...
-2
votos
1
respuesta
382
vistas
Como cambiar el logo de login en Laravel 9 + Vue.js
He intentado cambiar el icono que trae por defecto Laravel al ejecutar Vue.js, pero no h sido posible. La línea de codigo que trae es:
<template>
<svg viewBox="0 0 316 316" ...
0
votos
0
respuestas
71
vistas
Como cambiar el color con un GestureDetector de un Path SCG en Flutter?
espero alguien me pueda ayudar, estoy haciendo una aplicación donde el usuario escogerá X imagen que previamente con flutterShapeMaker pase del código SVG a clases como muestro a continuación (solo es ...
0
votos
0
respuestas
265
vistas
Como puedo colorear partes de un SVG en Flutter?
Edite esta pregunta, estoy cargando imágenes SVG en flutter con la librería svg_path_parser, la idea es rellenar de color cada path de la imagen, hasta ahora solo he podido cambiar el color de todo el ...
0
votos
0
respuestas
665
vistas
Poner una imagen (svg) detrás de texto
Estoy trabajando en la decoración de unos textos, y entre estos tengo que poner unos pocos gráficos.
Mi problema radica en que no he podido poner uno de esos gráficos detrás del texto, intente con z-...
0
votos
1
respuesta
47
vistas
problema html y css
.header__wave{
background: transparent;
border: none;
outline: none;
}
<div class="header__wave" style="height: 150px; overflow: hidden;" ><svg viewBox="0 0 500 150" ...
0
votos
1
respuesta
607
vistas
Conveniencia del SVG en Angular
Las formas que conozco de insertar un SVG son:
<img src="image.svg">
y con el SVG en linea (se puede manipular):
<svg class="image"> ... </svg>
Con esto me ...
0
votos
1
respuesta
532
vistas
Adaptar SVG al tamaño de la página
Muy buenas, diseñé una landing page en figma y luego la transcribi a html y css. Hasta ese punto todo excelente, pero al momento de incorporar mi svg, este no se adapta totalmente al sitio.
Ya he ...
2
votos
1
respuesta
208
vistas
¿Cómo animar y modificar el atributo "d" en el <path> de un SVG? (Ejemplo convertir un circulo a cuadrado)
Quisiera lograr crear una animación fluida de un SVG que se transforme de un circulo a un cuadrado por medio de modificar el atributo "d" de la etiqueta <path>.
Gracias de antemano
1
voto
1
respuesta
837
vistas
Problemas con renderizado de gráficos SVG
Contexto: estoy cambiando algunos de mis íconos en WebP por gráficos SVG para reducir tamaño y solicitudes HTTP pasándolas directamente como base64.
Tengo un SVG que funciona como imagen de fondo para ...
1
voto
0
respuestas
56
vistas
svg not found en nuxt local
Quiero mostrar unas banderas de paises y para ello encontré un plugin (https://www.growthbunker.dev/vueflags/)
Las imágenes de las banderas son svg y estan ubicadas en:
.app/
../assets/flags <- ...
2
votos
1
respuesta
302
vistas
React - Convertir componente a un svg
Estoy utilizando react para crear un componente que renderiza un svg, he decidido crearlo como componente para poder manipular sus colores.
import React from 'react';
const Home = ({ color}) => (
&...
1
voto
0
respuestas
67
vistas
Puedo poner elementos creados en JS dentro de svg
Estoy creando un Plugin para grafana, con @grafana/toolkit y quiero agregar un radar de chart.js dentro de un codigo svg. Al llamar a mi componente creado si lo intento graficar dentro del codigo svg ...
0
votos
0
respuestas
163
vistas
Imagen SVG desaparece después de animarla con CSS, ¿Cómo evitar que desaparezca?
Estoy practicando con imagenes SVG y las propiedades stroke-dashoffset y stroke-dasharray (soy muy novato), y he logrado una pequeña animación de un escudo que se forma mediante líneas, pero acabada ...
2
votos
1
respuesta
694
vistas
svg dinamico con cambio de color
Estoy obteniendo un listado de archivos svg para el manejo del menu lateral, los estoy renderizando utilizando object.
<object data="http://..." type="image/svg+xml"></...
0
votos
1
respuesta
439
vistas
Como hacer que una imagen svg no sea seleccionable por el usuario?
Buen dia amigos, tengo un problema, resulta que utilice una imagen svg para agregar un degradado a mi sitio web pero precisamente encima de esa imagen svg hay un texto y digamos si quisiera ...
1
voto
1
respuesta
822
vistas
¿como cambiar color de SVG con variables?
bueno estaba trabajando en un proyecto personal y me sucedió algo que no se si en verdad lo estoy entendiendo bien, el punto es que estoy cambiando los colores de un SVG con una clase de css la cual ...
2
votos
2
respuestas
1k
vistas
Usar SVG como Background-Image
Tengo un proyecto donde se me da un .svg para usar de background-image en un proyecto React.
No sé si hay alguna manera de referenciarlo en la propiedad backgroundImage si lo convierto en un ...
1
voto
1
respuesta
848
vistas
¿como cambiar el atributo d de path de svg o alguna posible alterntiva, para que se adapte al ancho de mi web?
me pregunto si esto es posible ya que tengo un svg que adapto a la pantalla de mi página web,el problema es que cuando quiero usar el svg para pantallas mas grandes aumenta su tamaño de tal forma para ...
1
voto
1
respuesta
408
vistas
Cómo programar en código JavaScript dentro de un lienzo SVG para dibujar o trazar cientos de líneas
Se desea dibujar muchas lineas verticales y todas paralelas entre si (como un peine) usando formato gráfico vectorial en lugar de CANVAS para evitar la distorsión al hacer zoom. S trazar multi-lineas ...
1
voto
1
respuesta
4k
vistas
¿Por qué mi imagen .svg no se ve?
estoy intentando aplicar una imagen .svg a mi sitio, pero cuando lo hago no se ve, aunque si está ahí. Es como si se pusiera transparente, como puedo solucionarlo?
0
votos
0
respuestas
47
vistas
¿Alguna Estrategia en Mente?
La siguiente imagen es de un tablero de un juego que estoy preparando
El juego consiste en lo siguiente:
2 Jugadores
Los cuales tiene que ir marcando cada línea que tiene en el tablero hasta formar el ...
0
votos
0
respuestas
107
vistas
¿Cómo puedo convertir un archivo svg animado en un archivo de video o varios archivos de imagen (fotograma por fotograma)?
Quiero convertir un archivo .svg animado en un video como .mp4, .mkv, etc. o en varios archivos de imagen fotograma por fotograma ya sea .png, .jpg. etc.
He encontrado este artículo donde tienen un ...
0
votos
1
respuesta
1k
vistas
Poner buttons dentro de un svg
Tengo el siguiente diseño de un rectángulo en etiquetas svg en html, pero dentro de ella quisiera poner 2 botones circulares uno alado de otro, de que manera puedo hacerlo?
<div class="row"&...
2
votos
1
respuesta
222
vistas
¿Cómo hacer correctamente 3 eventos de mouse en el mismo SVG?
estoy intentando crear un juego de unir con líneas utilizando SVG, las cuales tienen 2 columnas, y debo unir correctamente ambas, lo que quiero hacer es que con el evento mousedown sobre los gráficos ...
0
votos
1
respuesta
789
vistas
¿Por qué react no muestra un svg importado de una biblioteca externa?
Estoy usando una librería externa en react para mostrar un svg.
Según la documentación simplemente importo el svg en el componente y lo uso dentro de una etiqueta img, cómo hago a continuación.
import ...
0
votos
1
respuesta
295
vistas
Como puedo cargar una imagen en formato "SVG", en el header.php de Wordpress Gutenberg?? -
Estimad@s
Su gentil ayuda, por favor, ya me he quebrado la cabeza intentando hayar una solucion al siguiente inconveniente.
El codigo a continuacion es del header de un proyecto de Wordpress, el cual ...
4
votos
1
respuesta
296
vistas
¿Porqué los links del archivo svg dejan de funcionar si se utiliza un tag img?
Problema
Tengo un archivo svg que cuenta con un link <a> en su interior, la función de este link es repetir la animación del svg cada vez que se clica en él. Funciona correctamente si abro el ...
0
votos
1
respuesta
488
vistas
No puedo cambiar de color el fill SVG
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox=...
0
votos
1
respuesta
319
vistas
Obtener coordenadas (x,y) de un svg e insertar una etiqueta text con un value
Estoy intentando hacer una aplicación web con React para escribir tablaturas de guitarra, las tablaturas las estoy haciendo con SVG. Creo saber como obtener las coordenadas pero no sabría como ...
0
votos
0
respuestas
290
vistas
SVG en blanco | Angular
tengo dos componentes que contienen graficos svg (etiquetas)
uno es un carrito de compras y el otro es un logo
ambos se quedan en blanco
al eliminar un subcomponente estos vuelven a mostrarse
les ...
3
votos
1
respuesta
797
vistas
¿Cómo acceder al contenido del tag <object> en HTML?
Intento acceder al contenido de un tag <object> que carga un archivo. En lo especifico, deseo acceder al id de algunos de sus elementos y he probado a hacerlo con CSS y con JavaScript, pero nada ...
0
votos
1
respuesta
289
vistas
Cambiar imagen de fondo SVG en código JavaScript
He encontrado un código JS para usar en una web en el que caen diferentes copos de nieve.
Es el tradicional código que se usa en Navidad en las páginas web.
Como tengo un sitio musical se me ocurrió ...
2
votos
1
respuesta
432
vistas
¿Cómo animar el movimiento horizontal de un path SVG usando CSS?
Estoy animando un logo SVG con CSS y ya he logrado crear varios efectos pero no logro entender como hacer para que uno de los path del SVG se mueva horizontalmente (vea imagen).
También han fallado ...
2
votos
1
respuesta
114
vistas
No puedo meter un svg con la propiedad innerHTML
Estoy intentado meter un svg dentro de un span pero no he podido
El svg es este
<svg width='22px' height='24px' viewBox='0 0 20 22' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='...