Abrufen der Textbreite in SVG vor dem Rendern

Question

Ich möchte ein Rechteck um einen Text in SVG legen. Die Höhe des Textes ist mir bekannt (das font-size Attribut des text Elements). Die Breite hängt jedoch vom tatsächlichen Inhalt ab. Die Verwendung von getBBox() oder getComputedTextLength() sollte funktionieren. Aber das funktioniert nur nach dem Rendern.

Gibt es eine Möglichkeit, das auf eine andere Art zu spezifizieren? Zum Beispiel definieren die x und width Attribute relativ zu anderen Werten? So etwas habe ich in der SVG Spec nicht gefunden.

Answer 1

Die Bestimmung, wo Text endet, erfordert vermutlich ungefähr den gleichen zugrundeliegenden Codepfad wie das Rendering selbst - durchläuft die Breite jedes Zeichens basierend auf der Schriftart und dem Stil, etc ... Wie ich nicht weiß, definieren die SVG-Standards a Methode, um diese Information direkt zu erhalten, ohne das eigentliche vollständige Rendering durchzuführen, bis solche Methoden auftauchen oder von anderen hier gemeldet werden, sollte der Ansatz darin bestehen, unsichtbar zu rendern, bevor das tatsächliche Rendern durchgeführt wird.

Sie können dies in einer ausgeblendeten Ebene (Z-Index, Deckkraft und so) oder außerhalb des sichtbaren Ansichtsfensters tun, je nachdem, was beim Experimentieren am besten funktioniert. Sie müssen nur den Browser das Rendering durchführen, um herauszufinden, so dass Sie unsichtbar für diesen Zweck rendern, dann verwenden Sie getComputedTextLength()