Element.UseDef

Reference a previously defined SVG element with optional positioning and styling This function is used to reuse elements that have been defined using DaxLib.SVG.Def.* functions (e.g., DaxLib.SVG.Def.Circle, DaxLib.SVG.Def.Rect, DaxLib.SVG.Def.Paths, etc.). Instead of duplicating element definitions, use the appropriate DaxLib.SVG.Def.* function once and then reference it multiple times with DaxLib.SVG.Element.UseDef.

SyntaxExampleDefinition

DaxLib.SVG.Element.UseDef( defId, x, y, transforms )

Parameter	Type	Required	Description
defId	STRING		The identifier of the defined element to use
x	STRING		Optional: X position where the element should be placed
y	STRING		Optional: Y position where the element should be placed
transforms	STRING		Optional: Transformation to apply (can be generated with DaxLib.SVG.Transforms)

STRING element

VAR _Defs =
    DaxLib.SVG.Element.Defs(
        DaxLib.SVG.Def.Circle(
            "Circle1",      // id
            0,              // cx
            0,              // cy
            8,              // r
            DaxLib.SVG.Attr.Shapes(
                DaxLib.SVG.Colour.Theme(
                    "Power BI",
                    25
                ),          // fill
                0.8,        // fillOpacity
                BLANK(),    // fillRule
                "black",    // stroke
                1,          // strokeWidth
                0.8,        // strokeOpacity
                BLANK()     // opacity
            ),              // attributes
            BLANK()         // transforms
        ) &
        DaxLib.SVG.Def.Circle(
            "Circle2",      // id
            0,              // cx
            0,              // cy
            8,              // r
            DaxLib.SVG.Attr.Shapes(
                DaxLib.SVG.Colour.Theme(
                    "Power BI",
                    26
                ),          // fill
                0.8,        // fillOpacity
                BLANK(),    // fillRule
                "black",    // stroke
                1,          // strokeWidth
                0.8,        // strokeOpacity
                BLANK()     // opacity
            ),              // attributes
            BLANK()         // transforms
        ) &
        DaxLib.SVG.Def.Paths(
            "myPath",       // id
            "M10 10 L30 5 L90 15 L100 0", // d
            DaxLib.SVG.Attr.Shapes(
                "none",     // fill
                0.8,        // fillOpacity
                BLANK(),    // fillRule
                DaxLib.SVG.Colour.Theme(
                    "Power BI",
                    25
                ),          // stroke
                BLANK(),    // strokeWidth
                BLANK(),    // strokeOpacity
                BLANK()     // opacity
            ),              // attributes
            BLANK()         // transforms
        )
    )
VAR _Contents = 
    _Defs &
    DaxLib.SVG.Element.UseDef(
        "Circle1",   // id
        20,             // x
        10,             // y
        DaxLib.SVG.Transforms(
            BLANK(),    // translate
            30,         // rotate
            BLANK(),    // scale
            BLANK(),    // skewX
            BLANK()     // skewY
        )               // transforms
    ) &
    DaxLib.SVG.Element.UseDef(
        "Circle2",      // id
        50,             // x
        10,             // y
        BLANK()         // transforms
    ) &
    DaxLib.SVG.Element.UseDef(
        "Circle1",      // id
        80,             // x
        10,             // y
        BLANK()         // transforms
    ) &
    DaxLib.SVG.Element.UseDef(
        "myPath",       // id
        BLANK(),        // x
        5,              // y
        BLANK()         // transforms
    ) &
    DaxLib.SVG.Element.UseDef(
        "myPath",       // id
        BLANK(),        // x
        10,             // y
        DaxLib.SVG.Transforms(
            BLANK(),    // translate
            -10,        // rotate
            BLANK(),    // scale
            BLANK(),    // skewX
            BLANK()     // skewY
        )               // transforms
    )

RETURN
DaxLib.SVG.SVG(
    500,                // width
    100,                // height
    "0 0 100 20",       // viewbox
    _Contents,          // contents
    BLANK()             // sortValue
)

function 'DaxLib.SVG.Element.UseDef' =
        (
            defId: STRING,
            x: STRING,
            y: STRING,
            transforms: STRING
        ) =>

            "<use" &
            " href='#" & defId & "'" &
            IF( NOT ISBLANK( x ), " x='" & x & "'" ) &
            IF( NOT ISBLANK( y ), " y='" & y & "'" ) &
            IF( NOT ISBLANK( transforms ), " transform='" & transforms & "'" ) & 
            "/>"