Issue #2399💬 RespondidoAbierto el 12 de noviembre de 2019por imranali2045Reacciones 0

Componente SVG no arrastrable

Respuesta rápidapor imranali2045

@artf por favor, asegúrate de que para mí es muy importante resolver este problema. Gracias

Lee la respuesta completa abajo ↓

Pregunta

Hola, Estoy usando grapesjs en angular 7. Lo que quiero conseguir cuando llama cada método de caída de canvas es añadir un componente svg en canvas. He añadido un componente SVG en el método de caída de lienzo. Pero no se puede arrastrar. Adjunto mi código y vídeo para entenderlo mejor. Gracias @artf si me ayudas.

<code>const domComponentes = this._editor. DomComponents;</code> <code>const wrapperChildren = domComponents.getComponents();</code> <code>comp = wrapperChildren.add({</code> <code> etiquetaNombre: 'svg',</code> <code>Tipo: 'SVG',</code> <code>atributos: { viewBox: '0 0 100 100', xmlns: 'http://www.w3.org/2000/svg' },</code> <code>Estilizado: Cierto,</code> <code>redimensionable: cierto,</code> <code>removible: cierto, </code> no se puede quitar <code>arrastrable: cierto, </code> no puedo moverlo <code>copiable: true, </code> Desactivar copiar/pegar <code>Contenido: ' <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />', </code> <code> });</code>

! HD2-GoogleChrome2019-11-1215-08

Respuestas (3)

imranali204513 de noviembre de 2019

@artf por favor, asegúrate de que para mí es muy importante resolver este problema. Gracias

artf16 de noviembre de 2019

Desafortunadamente, la API de arrastrar y soltar HTML5 no funciona en elementos SVG, así que si necesitas soportarlo tienes que envolver tus componentes SVG (por ejemplo, en un elemento 'div').

imranali204518 de noviembre de 2019

@artf vale, gracias

Preguntas y respuestas relacionadas

Continúa investigando con debates sobre temas similares.

Plugins de pago que cumplen con este problema

Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.

Ver todos los plugins

Cargando recomendaciones de plugins de pago...

Opción gratuita

Consulta los plugins de código abierto de GrapesJS en GitHub O haz una búsqueda rápida en nuestro catálogo gratuito.

Explora plugins gratuitos →
Opción premium

Los plugins premium incluyen soporte, actualizaciones regulares y funciones listas para producción — ahorrando días de trabajo de integración.

Explora plugins premium →

Explorar categorías de plugins

Ve directamente a las páginas de categorías de plugins en el marketplace.