Compound.Area

Generates an Area compound SVG Visual

SyntaxExampleDefinition

DaxLib.SVG.Compound.Area( x, y, width, height, paddingX, paddingY, axisRef, measureRef, fillColor, fillOpacity, strokeColor )

Parameter	Type	Required	Description
x	INT64		The x position of the compound
y	INT64		The y position of the compound
width	INT64		The width of the compound
height	INT64		The height of the compound
paddingX	DOUBLE		The horizontal padding percentage (0.0-1.0, e.g., 0.1 = 10% padding)
paddingY	DOUBLE		The vertical padding percentage (0.0-1.0, e.g., 0.1 = 10% padding)
axisRef	ANYREF EXPR		The column that the measure will be evaluated against
measureRef	NUMERIC EXPR		The measure to evaluate
fillColor	STRING		The color of the area fill (e.g., "#01B8AA")
fillOpacity	NUMERIC		The opacity of the fill (0-1), defaults to 0.3
strokeColor	STRING		The color of the stroke line

STRING An SVG area chart element that visualizes the measure across the specified axis with filled area

    DaxLib.SVG.SVG(
        500,
        100,
        BLANK(),
        DaxLib.SVG.Compound.Area(
            0,              // x
            0,              // y
            500,            // width
            100,            // height
            0.05,           // paddingX
            0.02,           // paddingY
            Dates[Date],    // xAxis
            [Total Cost],   // measureVal
            DaxLib.SVG.Colour.Theme(
                "Power BI",
                25
            ),              // fillColour
            0.2,            // fillOpacity
            DaxLib.SVG.Colour.Theme(
                "Power BI",
                25
            )               // strokeColour
        ),
        BLANK()
    )

function 'DaxLib.SVG.Compound.Area' =
    (
        x: INT64,
        y: INT64,
        width: INT64,
        height: INT64,
        paddingX: DOUBLE,
        paddingY: DOUBLE,
        axisRef: ANYREF EXPR,
        measureRef: NUMERIC EXPR,
        fillColor: STRING,
        fillOpacity: NUMERIC,
        strokeColor: STRING
    ) =>

        // Apply padding to dimensions
        VAR _X =            x + ( width * ( COALESCE( paddingX, 0 ) / 2) )
        VAR _Y =            y + ( height * ( COALESCE( paddingY, 0 ) / 2) )
        VAR _Width =        width * ( 1 - COALESCE( paddingX, 0 ) )
        VAR _Height =       height * ( 1 - COALESCE( paddingY, 0 ) )

        // Check if Axis is numeric
        VAR axisSample =    MAX( axisRef )
        VAR axisIsNumeric = ISNUMERIC( axisSample ) || ISDATETIME( axisSample )

        // For totals
        // Materialize axis + value once (avoid repeated measure evaluation)
        VAR _Values =
            ADDCOLUMNS(
                VALUES( axisRef ),
                "@Value", measureRef
            )

        VAR _DataNonBlank =
            FILTER( _Values, NOT ISBLANK( [@Value] ) )

        VAR _Data =
            ADDCOLUMNS(
                _DataNonBlank,
                "@AxisIndex",
                    IF(
                        axisIsNumeric,
                        axisRef,
                        RANK( DENSE, CALCULATETABLE( VALUES( axisRef ), ALLSELECTED() ) )
                    )
            )

        VAR _XMin =     MINX( _Data, [@AxisIndex] )
        VAR _XMax =     MAXX( _Data, [@AxisIndex] )
        VAR _RawYMin =  MINX( _Data, [@Value] )
        VAR _YMin =     IF( _RawYMin > 0, 0, _RawYMin )
        VAR _YMax =     MAXX( _Data, [@Value] )
        VAR _XWidth =   _X + _Width
        VAR _YHeight =  _Y + _Height

        // Calculate baseline Y position (for zero line or bottom)
        VAR _BaselineY = DaxLib.SVG.Scale.Normalize( _YMin, _YMin, _YMax, _YHeight, _Y )

        // Cache
        VAR _DataNormalized = 
            ADDCOLUMNS(
                _Data,
                "@NormX", DaxLib.SVG.Scale.Normalize( [@AxisIndex], _XMin, _XMax, _X, _XWidth ),
                "@NormY", DaxLib.SVG.Scale.Normalize( [@Value], _YMin, _YMax, _YHeight, _Y )
            )

        // Get first and last X positions
        VAR _FirstX = MINX( _DataNormalized, [@NormX] )
        VAR _LastX = MAXX( _DataNormalized, [@NormX] )

        // Generate points for the area polygon
        // Start at baseline (bottom left), go up the data line, then back down to baseline
        VAR _PolygonPoints = 
            // Start at first X position at baseline
            _FirstX & "," & _BaselineY & " " & 
            // Add all the data points (the top line)
            CONCATENATEX(
                _DataNormalized,
                IF( 
                    NOT ISBLANK( [@Value] ), 
                    COMBINEVALUES( ",", [@NormX], [@NormY] )
                ),
                " ",
                [@AxisIndex],
                ASC
            )
            // End at last X position at baseline
            & " " & _LastX & "," & _BaselineY

        // Generate points for just the top line (for optional stroke)
        VAR _TopPoints = 
            CONCATENATEX(
                _DataNormalized,
                IF( 
                    NOT ISBLANK( [@Value] ), 
                    COMBINEVALUES( ",", [@NormX], [@NormY] )
                ),
                " ",
                [@AxisIndex],
                ASC
            )

        // Area Element (using polygon for filled area)
        VAR _AreaElement =
            DaxLib.SVG.Element.Polygon(
                _PolygonPoints,     // points
                DaxLib.SVG.Attr.Shapes(
                    fillColor,      // fill
                    IF( NOT ISBLANK( fillOpacity ), fillOpacity, 0.3 ), // fillOpacity
                    BLANK(),        // fillRule
                    "none",         // stroke
                    0,              // strokeWidth
                    BLANK(),        // strokeOpacity
                    BLANK()         // opacity
                ),
                BLANK()             // transforms
            )

        // stroke line on top of the area
        VAR _StrokeElement = 
            DaxLib.SVG.Element.Polyline(
                _TopPoints,         // points
                DaxLib.SVG.Attr.Shapes(
                    "none",         // fill
                    BLANK(),        // fillOpacity
                    BLANK(),        // fillRule
                    strokeColor,    // stroke
                    1,              // strokeWidth
                    BLANK(),        // strokeOpacity
                    BLANK()         // opacity
                ),
                BLANK()             // transforms
            )

        // Circle if only one point
        VAR _SinglePointElement =
            DaxLib.SVG.Element.Circle(
                    DaxLib.SVG.Scale.Normalize( MAXX( _Data, [@AxisIndex] ), _XMin, _XMax, _X, _XWidth ), // cx
                    DaxLib.SVG.Scale.Normalize( MAXX( _Data, [@Value] ), _YMin, _YMax, _YHeight, _Y ), // cy
                    2,                  // r
                    DaxLib.SVG.Attr.Shapes(
                        fillColor,     // fill
                        BLANK(),        // fillOpacity
                        BLANK(),        // fillRule
                        BLANK(),        // stroke
                        BLANK(),        // strokeWidth
                        BLANK(),        // strokeOpacity
                        BLANK()         // opacity
                    ),
                    BLANK()             // transforms
                )

        // Combine elements
        VAR _CombinedElements = 
            IF(
                COUNTROWS( _Data ) = 1,
                _SinglePointElement,
                _AreaElement &
                _StrokeElement
            )

        RETURN

            IF( NOT ISEMPTY( _Data ), _CombinedElements )

Comments