svg function

Component svg(
  1. List<Component> children, {
  2. String? viewBox,
  3. Unit? width,
  4. Unit? height,
  5. Key? key,
  6. String? id,
  7. String? classes,
  8. Styles? styles,
  9. Map<String, String>? attributes,
  10. Map<String, EventCallback>? events,
})

The <svg> element is a container that defines a new coordinate system and viewport. It is used as the outermost element of SVG documents, but it can also be used to embed an SVG fragment inside an SVG or HTML document.

  • viewBox: The SVG viewport coordinates for the current SVG fragment.
  • width: The displayed width of the rectangular viewport. (Not the width of its coordinate system.)
  • height: The displayed height of the rectangular viewport. (Not the height of its coordinate system.)

Implementation

Component svg(List<Component> children,
    {String? viewBox,
    Unit? width,
    Unit? height,
    Key? key,
    String? id,
    String? classes,
    Styles? styles,
    Map<String, String>? attributes,
    Map<String, EventCallback>? events}) {
  return DomComponent(
    tag: 'svg',
    key: key,
    id: id,
    classes: classes,
    styles: styles,
    attributes: {
      ...attributes ?? {},
      if (viewBox != null) 'viewBox': viewBox,
      if (width != null) 'width': width.value,
      if (height != null) 'height': height.value,
    },
    events: events,
    children: children,
  );
}