Class SvgGraphicsElement

java.lang.Object
com.vaadin.flow.dom.Node<com.vaadin.flow.dom.Element>
com.vaadin.flow.dom.Element
org.vaadin.firitin.element.svg.SvgElement
org.vaadin.firitin.element.svg.SvgGraphicsElement
All Implemented Interfaces:
Serializable
Direct Known Subclasses:
CircleElement, EllipseElement, GElement, ImageElement, LineElement, PathElement, PolygonElement, PolylineElement, RectElement, TextElement, TextPathElement, TSpanElement, UseElement

public class SvgGraphicsElement extends SvgElement
Base class for SVG graphics elements that can be rendered with fill and stroke.

This class provides common presentation attributes for SVG shapes like rectangles, circles, ellipses, lines, paths, and polygons.

Mirrors the SVG DOM hierarchy where SVGGraphicsElement is the base for renderable elements.

Write-Only vs Read-Write Methods

This class provides two variants for each attribute setter:

  • Default methods (e.g., fill(), stroke()) - Use an optimized write-only approach. Attribute values are NOT stored on the server and cannot be retrieved via getAttribute().
  • RW methods (e.g., fillRW(), strokeRW()) - Use traditional setAttribute() which stores values on the server for later retrieval.
See Also:
  • Constructor Details

    • SvgGraphicsElement

      public SvgGraphicsElement(String tag)
  • Method Details

    • fill

      public <T extends SvgGraphicsElement> T fill(in.virit.color.Color color)
      Sets the fill color using a Color object.

      Uses write-only optimization. Use fillRW(Color) if you need to read the value back.

      Parameters:
      color - the fill color
      Returns:
      this element for method chaining
    • fill

      public <T extends SvgGraphicsElement> T fill(String fill)
      Sets the fill color using a string value.

      Uses write-only optimization. Use fillRW(String) if you need to read the value back.

      Parameters:
      fill - the fill color (e.g., "red", "#ff0000", "rgb(255,0,0)", "url(#gradient)")
      Returns:
      this element for method chaining
    • fillRW

      public <T extends SvgGraphicsElement> T fillRW(in.virit.color.Color color)
      Sets the fill color using a Color object (read-write).
      Parameters:
      color - the fill color
      Returns:
      this element for method chaining
    • fillRW

      public <T extends SvgGraphicsElement> T fillRW(String fill)
      Sets the fill color using a string value (read-write).
      Parameters:
      fill - the fill color (e.g., "red", "#ff0000", "rgb(255,0,0)", "url(#gradient)")
      Returns:
      this element for method chaining
    • noFill

      public <T extends SvgGraphicsElement> T noFill()
      Sets the fill to none (transparent).

      Uses write-only optimization. Use noFillRW() if you need to read the value back.

      Returns:
      this element for method chaining
    • noFillRW

      public <T extends SvgGraphicsElement> T noFillRW()
      Sets the fill to none (transparent) (read-write).
      Returns:
      this element for method chaining
    • fillOpacity

      public <T extends SvgGraphicsElement> T fillOpacity(double opacity)
      Sets the fill opacity.

      Uses write-only optimization. Use fillOpacityRW(double) if you need to read the value back.

      Parameters:
      opacity - the opacity value from 0.0 (fully transparent) to 1.0 (fully opaque)
      Returns:
      this element for method chaining
    • fillOpacityRW

      public <T extends SvgGraphicsElement> T fillOpacityRW(double opacity)
      Sets the fill opacity (read-write).
      Parameters:
      opacity - the opacity value from 0.0 (fully transparent) to 1.0 (fully opaque)
      Returns:
      this element for method chaining
    • stroke

      public <T extends SvgGraphicsElement> T stroke(in.virit.color.Color color)
      Sets the stroke color using a Color object.

      Uses write-only optimization. Use strokeRW(Color) if you need to read the value back.

      Parameters:
      color - the stroke color
      Returns:
      this element for method chaining
    • stroke

      public <T extends SvgGraphicsElement> T stroke(String stroke)
      Sets the stroke color using a string value.

      Uses write-only optimization. Use strokeRW(String) if you need to read the value back.

      Parameters:
      stroke - the stroke color (e.g., "black", "#000000", "rgb(0,0,0)", "url(#gradient)")
      Returns:
      this element for method chaining
    • strokeRW

      public <T extends SvgGraphicsElement> T strokeRW(in.virit.color.Color color)
      Sets the stroke color using a Color object (read-write).
      Parameters:
      color - the stroke color
      Returns:
      this element for method chaining
    • strokeRW

      public <T extends SvgGraphicsElement> T strokeRW(String stroke)
      Sets the stroke color using a string value (read-write).
      Parameters:
      stroke - the stroke color (e.g., "black", "#000000", "rgb(0,0,0)", "url(#gradient)")
      Returns:
      this element for method chaining
    • noStroke

      public <T extends SvgGraphicsElement> T noStroke()
      Sets the stroke to none (no outline).

      Uses write-only optimization. Use noStrokeRW() if you need to read the value back.

      Returns:
      this element for method chaining
    • noStrokeRW

      public <T extends SvgGraphicsElement> T noStrokeRW()
      Sets the stroke to none (no outline) (read-write).
      Returns:
      this element for method chaining
    • strokeWidth

      public <T extends SvgGraphicsElement> T strokeWidth(double width)
      Sets the stroke width.

      Uses write-only optimization. Use strokeWidthRW(double) if you need to read the value back.

      Parameters:
      width - the stroke width in user units
      Returns:
      this element for method chaining
    • strokeWidth

      public <T extends SvgGraphicsElement> T strokeWidth(String width)
      Sets the stroke width with a unit.

      Uses write-only optimization. Use strokeWidthRW(String) if you need to read the value back.

      Parameters:
      width - the stroke width (e.g., "2", "2px", "0.5em")
      Returns:
      this element for method chaining
    • strokeWidthRW

      public <T extends SvgGraphicsElement> T strokeWidthRW(double width)
      Sets the stroke width (read-write).
      Parameters:
      width - the stroke width in user units
      Returns:
      this element for method chaining
    • strokeWidthRW

      public <T extends SvgGraphicsElement> T strokeWidthRW(String width)
      Sets the stroke width with a unit (read-write).
      Parameters:
      width - the stroke width (e.g., "2", "2px", "0.5em")
      Returns:
      this element for method chaining
    • strokeOpacity

      public <T extends SvgGraphicsElement> T strokeOpacity(double opacity)
      Sets the stroke opacity.

      Uses write-only optimization. Use strokeOpacityRW(double) if you need to read the value back.

      Parameters:
      opacity - the opacity value from 0.0 (fully transparent) to 1.0 (fully opaque)
      Returns:
      this element for method chaining
    • strokeOpacityRW

      public <T extends SvgGraphicsElement> T strokeOpacityRW(double opacity)
      Sets the stroke opacity (read-write).
      Parameters:
      opacity - the opacity value from 0.0 (fully transparent) to 1.0 (fully opaque)
      Returns:
      this element for method chaining
    • strokeLinecap

      public <T extends SvgGraphicsElement> T strokeLinecap(SvgGraphicsElement.LineCap lineCap)
      Sets the shape of line endings.

      Uses write-only optimization. Use strokeLinecapRW(LineCap) if you need to read the value back.

      Parameters:
      lineCap - the line cap style
      Returns:
      this element for method chaining
    • strokeLinecapRW

      public <T extends SvgGraphicsElement> T strokeLinecapRW(SvgGraphicsElement.LineCap lineCap)
      Sets the shape of line endings (read-write).
      Parameters:
      lineCap - the line cap style
      Returns:
      this element for method chaining
    • strokeLinejoin

      public <T extends SvgGraphicsElement> T strokeLinejoin(SvgGraphicsElement.LineJoin lineJoin)
      Sets the shape of line corners.

      Uses write-only optimization. Use strokeLinejoinRW(LineJoin) if you need to read the value back.

      Parameters:
      lineJoin - the line join style
      Returns:
      this element for method chaining
    • strokeLinejoinRW

      public <T extends SvgGraphicsElement> T strokeLinejoinRW(SvgGraphicsElement.LineJoin lineJoin)
      Sets the shape of line corners (read-write).
      Parameters:
      lineJoin - the line join style
      Returns:
      this element for method chaining
    • strokeMiterlimit

      public <T extends SvgGraphicsElement> T strokeMiterlimit(double limit)
      Sets the miter limit for miter line joins.

      When two lines meet at a sharp angle and miter join is used, the miter can extend far beyond the stroke width. This limit controls when to switch to a bevel join instead.

      Uses write-only optimization. Use strokeMiterlimitRW(double) if you need to read the value back.

      Parameters:
      limit - the miter limit (default is 4)
      Returns:
      this element for method chaining
    • strokeMiterlimitRW

      public <T extends SvgGraphicsElement> T strokeMiterlimitRW(double limit)
      Sets the miter limit for miter line joins (read-write).
      Parameters:
      limit - the miter limit (default is 4)
      Returns:
      this element for method chaining
    • strokeDasharray

      public <T extends SvgGraphicsElement> T strokeDasharray(String dasharray)
      Sets the dash pattern for the stroke.

      The pattern is specified as a comma or space separated list of lengths. Odd positions define dash lengths, even positions define gap lengths.

      Uses write-only optimization. Use strokeDasharrayRW(String) if you need to read the value back.

      Parameters:
      dasharray - the dash pattern (e.g., "5,10", "5 10 5", "10,5,5,5")
      Returns:
      this element for method chaining
    • strokeDasharray

      public <T extends SvgGraphicsElement> T strokeDasharray(double... values)
      Sets the dash pattern for the stroke using numeric values.

      Uses write-only optimization. Use strokeDasharrayRW(double...) if you need to read the value back.

      Parameters:
      values - the dash and gap lengths alternating
      Returns:
      this element for method chaining
    • strokeDasharrayRW

      public <T extends SvgGraphicsElement> T strokeDasharrayRW(String dasharray)
      Sets the dash pattern for the stroke (read-write).
      Parameters:
      dasharray - the dash pattern (e.g., "5,10", "5 10 5", "10,5,5,5")
      Returns:
      this element for method chaining
    • strokeDasharrayRW

      public <T extends SvgGraphicsElement> T strokeDasharrayRW(double... values)
      Sets the dash pattern for the stroke using numeric values (read-write).
      Parameters:
      values - the dash and gap lengths alternating
      Returns:
      this element for method chaining
    • strokeDashoffset

      public <T extends SvgGraphicsElement> T strokeDashoffset(double offset)
      Sets the offset for the dash pattern.

      Uses write-only optimization. Use strokeDashoffsetRW(double) if you need to read the value back.

      Parameters:
      offset - the offset in user units
      Returns:
      this element for method chaining
    • strokeDashoffsetRW

      public <T extends SvgGraphicsElement> T strokeDashoffsetRW(double offset)
      Sets the offset for the dash pattern (read-write).
      Parameters:
      offset - the offset in user units
      Returns:
      this element for method chaining
    • opacity

      public <T extends SvgGraphicsElement> T opacity(double opacity)
      Sets the overall opacity of the element (both fill and stroke).

      Uses write-only optimization. Use opacityRW(double) if you need to read the value back.

      Parameters:
      opacity - the opacity value from 0.0 (fully transparent) to 1.0 (fully opaque)
      Returns:
      this element for method chaining
    • opacityRW

      public <T extends SvgGraphicsElement> T opacityRW(double opacity)
      Sets the overall opacity of the element (read-write).
      Parameters:
      opacity - the opacity value from 0.0 (fully transparent) to 1.0 (fully opaque)
      Returns:
      this element for method chaining
    • clipPath

      public <T extends SvgGraphicsElement> T clipPath(ClipPathElement clipPath)
      Sets a clipping path for this element.

      Parts of the element outside the clipping region will not be rendered. An ID is automatically generated for the clip path if not already set.

      Uses write-only optimization. Use clipPathRW(ClipPathElement) if you need to read the value back.

      Parameters:
      clipPath - the clip path element
      Returns:
      this element for method chaining
    • clipPathRW

      public <T extends SvgGraphicsElement> T clipPathRW(ClipPathElement clipPath)
      Sets a clipping path for this element (read-write).
      Parameters:
      clipPath - the clip path element
      Returns:
      this element for method chaining
    • mask

      public <T extends SvgGraphicsElement> T mask(MaskElement mask)
      Sets a mask for this element.

      The mask controls the transparency of the element based on the luminance or alpha values of the mask contents. An ID is automatically generated for the mask if not already set.

      Uses write-only optimization. Use maskRW(MaskElement) if you need to read the value back.

      Parameters:
      mask - the mask element
      Returns:
      this element for method chaining
    • maskRW

      public <T extends SvgGraphicsElement> T maskRW(MaskElement mask)
      Sets a mask for this element (read-write).
      Parameters:
      mask - the mask element
      Returns:
      this element for method chaining
    • fill

      public <T extends SvgGraphicsElement> T fill(LinearGradientElement gradient)
      Sets the fill to use a gradient.

      An ID is automatically generated for the gradient if not already set.

      Uses write-only optimization. Use fillRW(LinearGradientElement) if you need to read the value back.

      Parameters:
      gradient - the gradient element (linear or radial)
      Returns:
      this element for method chaining
    • fillRW

      public <T extends SvgGraphicsElement> T fillRW(LinearGradientElement gradient)
      Sets the fill to use a gradient (read-write).
      Parameters:
      gradient - the gradient element (linear or radial)
      Returns:
      this element for method chaining
    • fill

      public <T extends SvgGraphicsElement> T fill(RadialGradientElement gradient)
      Sets the fill to use a radial gradient.

      An ID is automatically generated for the gradient if not already set.

      Uses write-only optimization. Use fillRW(RadialGradientElement) if you need to read the value back.

      Parameters:
      gradient - the radial gradient element
      Returns:
      this element for method chaining
    • fillRW

      public <T extends SvgGraphicsElement> T fillRW(RadialGradientElement gradient)
      Sets the fill to use a radial gradient (read-write).
      Parameters:
      gradient - the radial gradient element
      Returns:
      this element for method chaining
    • fill

      public <T extends SvgGraphicsElement> T fill(PatternElement pattern)
      Sets the fill to use a pattern.

      An ID is automatically generated for the pattern if not already set.

      Uses write-only optimization. Use fillRW(PatternElement) if you need to read the value back.

      Parameters:
      pattern - the pattern element
      Returns:
      this element for method chaining
    • fillRW

      public <T extends SvgGraphicsElement> T fillRW(PatternElement pattern)
      Sets the fill to use a pattern (read-write).
      Parameters:
      pattern - the pattern element
      Returns:
      this element for method chaining
    • stroke

      public <T extends SvgGraphicsElement> T stroke(LinearGradientElement gradient)
      Sets the stroke to use a gradient.

      An ID is automatically generated for the gradient if not already set.

      Uses write-only optimization. Use strokeRW(LinearGradientElement) if you need to read the value back.

      Parameters:
      gradient - the gradient element
      Returns:
      this element for method chaining
    • strokeRW

      public <T extends SvgGraphicsElement> T strokeRW(LinearGradientElement gradient)
      Sets the stroke to use a gradient (read-write).
      Parameters:
      gradient - the gradient element
      Returns:
      this element for method chaining
    • stroke

      public <T extends SvgGraphicsElement> T stroke(RadialGradientElement gradient)
      Sets the stroke to use a radial gradient.

      An ID is automatically generated for the gradient if not already set.

      Uses write-only optimization. Use strokeRW(RadialGradientElement) if you need to read the value back.

      Parameters:
      gradient - the radial gradient element
      Returns:
      this element for method chaining
    • strokeRW

      public <T extends SvgGraphicsElement> T strokeRW(RadialGradientElement gradient)
      Sets the stroke to use a radial gradient (read-write).
      Parameters:
      gradient - the radial gradient element
      Returns:
      this element for method chaining
    • stroke

      public <T extends SvgGraphicsElement> T stroke(PatternElement pattern)
      Sets the stroke to use a pattern.

      An ID is automatically generated for the pattern if not already set.

      Uses write-only optimization. Use strokeRW(PatternElement) if you need to read the value back.

      Parameters:
      pattern - the pattern element
      Returns:
      this element for method chaining
    • strokeRW

      public <T extends SvgGraphicsElement> T strokeRW(PatternElement pattern)
      Sets the stroke to use a pattern (read-write).
      Parameters:
      pattern - the pattern element
      Returns:
      this element for method chaining
    • transform

      public <T extends SvgGraphicsElement> T transform(String transform)
      Sets the transform attribute directly.

      Multiple transforms can be specified separated by spaces or commas.

      Uses write-only optimization. Use transformRW(String) if you need to read the value back.

      Parameters:
      transform - the transform string (e.g., "translate(30,40) rotate(45)")
      Returns:
      this element for method chaining
    • transformRW

      public <T extends SvgGraphicsElement> T transformRW(String transform)
      Sets the transform attribute directly (read-write).
      Parameters:
      transform - the transform string (e.g., "translate(30,40) rotate(45)")
      Returns:
      this element for method chaining
    • translate

      public <T extends SvgGraphicsElement> T translate(double x, double y)
      Moves the element to a new position.

      Uses write-only optimization. Use translateRW(double, double) if you need to read the value back.

      Parameters:
      x - the x offset
      y - the y offset
      Returns:
      this element for method chaining
    • translateRW

      public <T extends SvgGraphicsElement> T translateRW(double x, double y)
      Moves the element to a new position (read-write).
      Parameters:
      x - the x offset
      y - the y offset
      Returns:
      this element for method chaining
    • translateX

      public <T extends SvgGraphicsElement> T translateX(double x)
      Moves the element horizontally.

      Uses write-only optimization. Use translateXRW(double) if you need to read the value back.

      Parameters:
      x - the x offset
      Returns:
      this element for method chaining
    • translateXRW

      public <T extends SvgGraphicsElement> T translateXRW(double x)
      Moves the element horizontally (read-write).
      Parameters:
      x - the x offset
      Returns:
      this element for method chaining
    • translateY

      public <T extends SvgGraphicsElement> T translateY(double y)
      Moves the element vertically.

      Uses write-only optimization. Use translateYRW(double) if you need to read the value back.

      Parameters:
      y - the y offset
      Returns:
      this element for method chaining
    • translateYRW

      public <T extends SvgGraphicsElement> T translateYRW(double y)
      Moves the element vertically (read-write).
      Parameters:
      y - the y offset
      Returns:
      this element for method chaining
    • rotate

      public <T extends SvgGraphicsElement> T rotate(double angle)
      Rotates the element around the origin (0,0).

      Uses write-only optimization. Use rotateRW(double) if you need to read the value back.

      Parameters:
      angle - the rotation angle in degrees
      Returns:
      this element for method chaining
    • rotateRW

      public <T extends SvgGraphicsElement> T rotateRW(double angle)
      Rotates the element around the origin (0,0) (read-write).
      Parameters:
      angle - the rotation angle in degrees
      Returns:
      this element for method chaining
    • rotate

      public <T extends SvgGraphicsElement> T rotate(double angle, double cx, double cy)
      Rotates the element around a specified center point.

      Uses write-only optimization. Use rotateRW(double, double, double) if you need to read the value back.

      Parameters:
      angle - the rotation angle in degrees
      cx - the x coordinate of the rotation center
      cy - the y coordinate of the rotation center
      Returns:
      this element for method chaining
    • rotateRW

      public <T extends SvgGraphicsElement> T rotateRW(double angle, double cx, double cy)
      Rotates the element around a specified center point (read-write).
      Parameters:
      angle - the rotation angle in degrees
      cx - the x coordinate of the rotation center
      cy - the y coordinate of the rotation center
      Returns:
      this element for method chaining
    • scale

      public <T extends SvgGraphicsElement> T scale(double factor)
      Scales the element uniformly.

      Uses write-only optimization. Use scaleRW(double) if you need to read the value back.

      Parameters:
      factor - the scale factor (1.0 = no change, 0.5 = half size, 2.0 = double size)
      Returns:
      this element for method chaining
    • scaleRW

      public <T extends SvgGraphicsElement> T scaleRW(double factor)
      Scales the element uniformly (read-write).
      Parameters:
      factor - the scale factor (1.0 = no change, 0.5 = half size, 2.0 = double size)
      Returns:
      this element for method chaining
    • scale

      public <T extends SvgGraphicsElement> T scale(double sx, double sy)
      Scales the element with different factors for x and y axes.

      Uses write-only optimization. Use scaleRW(double, double) if you need to read the value back.

      Parameters:
      sx - the x scale factor
      sy - the y scale factor
      Returns:
      this element for method chaining
    • scaleRW

      public <T extends SvgGraphicsElement> T scaleRW(double sx, double sy)
      Scales the element with different factors for x and y axes (read-write).
      Parameters:
      sx - the x scale factor
      sy - the y scale factor
      Returns:
      this element for method chaining
    • skewX

      public <T extends SvgGraphicsElement> T skewX(double angle)
      Skews the element along the x axis.

      Uses write-only optimization. Use skewXRW(double) if you need to read the value back.

      Parameters:
      angle - the skew angle in degrees
      Returns:
      this element for method chaining
    • skewXRW

      public <T extends SvgGraphicsElement> T skewXRW(double angle)
      Skews the element along the x axis (read-write).
      Parameters:
      angle - the skew angle in degrees
      Returns:
      this element for method chaining
    • skewY

      public <T extends SvgGraphicsElement> T skewY(double angle)
      Skews the element along the y axis.

      Uses write-only optimization. Use skewYRW(double) if you need to read the value back.

      Parameters:
      angle - the skew angle in degrees
      Returns:
      this element for method chaining
    • skewYRW

      public <T extends SvgGraphicsElement> T skewYRW(double angle)
      Skews the element along the y axis (read-write).
      Parameters:
      angle - the skew angle in degrees
      Returns:
      this element for method chaining
    • matrix

      public <T extends SvgGraphicsElement> T matrix(double a, double b, double c, double d, double e, double f)
      Applies a 2D transformation matrix.

      The matrix transforms coordinates as:

      x_new = a*x + c*y + e
      y_new = b*x + d*y + f
      

      Uses write-only optimization. Use matrixRW(double, double, double, double, double, double) if you need to read the value back.

      Parameters:
      a - the a component (scale x)
      b - the b component (skew y)
      c - the c component (skew x)
      d - the d component (scale y)
      e - the e component (translate x)
      f - the f component (translate y)
      Returns:
      this element for method chaining
    • matrixRW

      public <T extends SvgGraphicsElement> T matrixRW(double a, double b, double c, double d, double e, double f)
      Applies a 2D transformation matrix (read-write).
      Parameters:
      a - the a component (scale x)
      b - the b component (skew y)
      c - the c component (skew x)
      d - the d component (scale y)
      e - the e component (translate x)
      f - the f component (translate y)
      Returns:
      this element for method chaining
    • clearTransform

      public <T extends SvgGraphicsElement> T clearTransform()
      Clears all transforms from the element.
      Returns:
      this element for method chaining