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.
| Parameter | Type | Required | Default | Description |
|---|---|---|---|---|
| defId | STRING | The identifier of the defined element to use | ||
| x | STRING | BLANK() |
Optional: X position where the element should be placed | |
| y | STRING | BLANK() |
Optional: Y position where the element should be placed | |
| transforms | STRING | BLANK() |
Optional: Transformation to apply (can be generated with DaxLib.SVG.Transforms) |
STRING
VAR _Defs =
DaxLib.SVG.Element.Defs(
DaxLib.SVG.Def.Circle(
"Circle1", // defId
0, // cx
0, // cy
8, // r
DaxLib.SVG.Attr.Shapes(
DaxLib.SVG.Color.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", // defId
0, // cx
0, // cy
8, // r
DaxLib.SVG.Attr.Shapes(
DaxLib.SVG.Color.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", // defId
"M10 10 L30 5 L90 15 L100 0", // d
DaxLib.SVG.Attr.Shapes(
"none", // fill
0.8, // fillOpacity
BLANK(), // fillRule
DaxLib.SVG.Color.Theme(
"Power BI",
25
), // stroke
BLANK(), // strokeWidth
BLANK(), // strokeOpacity
BLANK() // opacity
), // attributes
BLANK() // transforms
)
)
VAR _Contents =
_Defs &
DaxLib.SVG.Element.UseDef(
"Circle1", // defId
20, // x
10, // y
DaxLib.SVG.Transforms(
BLANK(), // translate
30, // rotate
BLANK(), // scale
BLANK(), // skewX
BLANK() // skewY
) // transforms
) &
DaxLib.SVG.Element.UseDef(
"Circle2", // defId
50, // x
10, // y
BLANK() // transforms
) &
DaxLib.SVG.Element.UseDef(
"Circle1", // defId
80, // x
10, // y
BLANK() // transforms
) &
DaxLib.SVG.Element.UseDef(
"myPath", // defId
BLANK(), // x
5, // y
BLANK() // transforms
) &
DaxLib.SVG.Element.UseDef(
"myPath", // defId
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
_Contents, // contents
"0 0 100 20", // viewbox
BLANK() // sortValue
)
function 'DaxLib.SVG.Element.UseDef' =
(
defId: STRING,
x: STRING = BLANK(),
y: STRING = BLANK(),
transforms: STRING = BLANK()
) =>
"<use" &
" href='#" & defId & "'" &
IF( NOT ISBLANK( x ), " x='" & x & "'" ) &
IF( NOT ISBLANK( y ), " y='" & y & "'" ) &
IF( NOT ISBLANK( transforms ), " transform='" & transforms & "'" ) &
"/>"