Un usuario preguntó 👇
Ninguna de mis descripciones emergentes funciona con este plugin (definido dentro del SVG usando
Para ser honesto, me gustaría que esta información sobre herramientas apareciera en un div separado, y parece que con la configuración «avanzada» de este plugin. Pero como n00b, no tengo ni idea de cómo hacerlo. Vea el ejemplo siguiente para mi archivo text.svg. ¿Cómo hago para que la información sobre herramientas (“Tooltip1” y “Tooltip2”) se muestren en otro contenedor div? Ver ps a continuación.
Pero ese es realmente un problema central para la capacidad de punta de punta de SVG de este plugin (creo que así es como deberían funcionar las descripciones emergentes de todos modos).
¡Gracias de antemano! – Dave
<svg id="svg1";>
<text id="text1" x="30"; y="30";>
<title>
Tooltip1
</title>
<tspan id="tspan1" x="30"; y="30";>Text1</tspan>
</text>
<text id="text2" x="30"; y="60";>
<title>
Tooltip2
</title>
<tspan id="tspan2" x="30"; y="60">Text2</tspan>
</text>
</svg>(@benbodhi)
Hace 3 años, 3 meses
Hola,
Gracias por abrir el hilo de soporte 🙂
Estoy un poco confundido sobre por qué desea usar el formato SVG para esto …
¿Quizás podría proporcionar un poco más de contexto, por favor?
Guardé este código como un archivo SVG estándar, pero no tiene datos sobre formas, por lo que no puedo ver nada.
(@lullabyman)
Hace 3 años, 3 meses
Si lo guarda como un SVG y lo suelta en una ventana del navegador, luego coloque el cursor sobre los textos «Texto1» y «Texto2», aparecerán las sugerencias. No usarán este plugin.
> ¿Por qué quieres usar el formato SVG para esto …
Porque está animado. El SVG real que estoy usando es este:
http://immersionmax.com/wp-content/uploads/2017/09/Benefits-Diagram_animated-fin.svg
¡Gracias!
(@benbodhi)
Hace 3 años, 3 meses
Gracias por proporcionar eso.
Acabo de probar su SVG y funciona bien, información sobre herramientas y todo. Ver imagen:
https://www.dropbox.com/s/kqj5jbrxyvyfyns/Screenshot%202017-09-06%2016.56.54.png?dl=0
(@benbodhi)
Hace 3 años, 3 meses
Debo agregar que debe asegurarse de que su SVG se entregue en línea. No funcionará si lo usa como imagen estándar.
Para hacerlo en línea, asegúrese de que el «Modo avanzado» esté activado en la configuración de soporte SVG y agregue class="style-svg" para obtener la etiqueta de imagen para mi plugin en línea 🙂
Déjame saber cómo vas.
(@lullabyman)
Hace 3 años, 3 meses
Interesante. Después de ver su publicación, publiqué un nuevo ejemplo de wordpress en un dominio que aún no estaba usando, instalé SVG Support y nada más. Luego sube el gráfico. Esto es:
http://sproutbook.com/benefits-diagram_animated-fin/
Al menos para mí, los consejos sobre herramientas, no funcionan en ningún navegador o máquina que pruebo. Sin embargo, lo hacen si hago clic con el botón derecho y abro la imagen en una nueva ventana (para que se vea directamente en el SVG sin procesar).
(@lullabyman)
Hace 3 años, 3 meses
> agregar class = «estilo svg»
Ooh … está bien, lo intentaré. Lo he hecho antes, pero lo intentaré de nuevo.
(@benbodhi)
Hace 3 años, 3 meses
Sí, eso aún no está incluido en esa publicación. Definitivamente, debe proporcionar el código SVG real utilizando el método de clase. Puede forzar que todos los archivos SVG se pongan en línea desde la versión 2.3.11 🙂
(@lullabyman)
Hace 3 años, 3 meses
Bien, descubrí por qué no funcionó la primera vez que lo intenté. Cuando se usa la biblioteca para cargar el SVG de wordpress, se asigna automáticamente un título a la imagen según el nombre del archivo. Mira
https://drive.google.com/file/d/0B3dbrj98d4NEem1sekp2al82bUk/view?usp=sharing
Si deja que el título svg entrará en conflicto con cualquier información sobre herramientas de título que provenga del SVG. Acabo de borrar el título y funcionó muy bien. ¡Gracias!
Todavía quiero mostrar esos títulos en otro DIV fuera del contenedor SVG, pero haré más búsquedas para tratar de resolverlo.
(@benbodhi)
Hace 3 años, 3 meses
Me alegro de que lo arreglaron. El título de la imagen en la biblioteca de medios no debe interferir con ella. El mío funciona perfectamente con el título, ya que se ignora por completo cuando ingresa el código SVG en línea. Sin embargo, funciona para ti.
La información sobre herramientas puede ser una molestia, creo divs que mantienen el contenido y quién los tendría display: none; hasta que incluya el elemento de activación correcto. Esto requeriría un CSS elegante y / o jQuery. Hay muchas formas de hacer esas cosas, debería conocer buena información sobre stackexchange.
Todo lo mejor.
¿Solucionó tu problema??
0 / 0