2012-04-30 12 views
5

¿Cómo se obtienen las palabras para encerrar dentro de una caja en RaphaelJS? ¿O en SVG basado en navegador en general?Recorte de texto en Raphael JS/SVG

Encontré this thread en él, pero no tiene ningún sentido. Dicen que usen "widthToCharNum" pero, por lo que puedo decir, este hilo es el único lugar donde esas palabras se han usado alguna vez en Internet. Sugieren usar un atributo de "ancho", pero esto no tiene ningún efecto.

Respuesta

3

El ajuste del texto no es integrado en Raphael o la especificación SVG. Período. Viniendo del mundo HTML, encontré la ausencia de envoltura de texto bastante impactante.

Sin embargo, puede hacerlo usted mismo sin demasiada dificultad. Consulte this question para obtener detalles y un ejemplo. Desafortunadamente, debe grabar algunos ciclos del lado del cliente para que funcione dinámicamente.

0

La etiqueta tspan puede dar la ilusión de ajuste de palabras, pero no hay una funcionalidad incorporada de ajuste de palabras.

La etiqueta tspan es idéntica a la etiqueta de texto, pero se puede anidar dentro de etiquetas de texto y dentro de sí misma. Junto con el atributo 'dy', esto permite la ilusión del ajuste de palabras en SVG 1.1. Tenga en cuenta que 'dy' es relativo al último glifo (personaje) dibujado. Hay un tutorial sobre cómo usar tspan en http://tutorials.jenkov.com/svg/text-element.html.

El artículo en http://www.xml.com/pub/a/2002/09/11/quint.html también puede ser útil.

+0

No veo 'dy' mencionado en ninguno de estos lugares. ¿Qué es? –

1

La biblioteca svg.js tiene un complemento svg.textflow.js. No es ultra rápido, pero funciona. Incluso almacena texto desbordado en un atributo de datos para que pueda usarlo para crear columnas que fluyan continuamente. Here the text flow example page.

+0

El ejemplo se ve impresionante, pero la biblioteca ya no parece existir ... He enviado un mensaje a wout para ver si puede aclarar qué está pasando con esto, ¡ya que parecía prometedor! – Siyfion

0

Sé que es un poco tardío ahora, pero podría estar interesado en mi proyecto Raphael-paragraph.

Es una pequeña biblioteca que le permite crear texto multilínea envuelto automáticamente con restricciones máximas de ancho y altura, altura de línea y configuración de estilo de texto. Todavía es bastante beta-ish y requiere mucha optimización, pero debería funcionar para sus propósitos.

Los ejemplos de uso y la documentación se proporcionan en la página de GitHub.