AreaChart

let areaChartDataList = [
    [
        lineChartPoints.opacity 1.0
        lineChartPoints.legend "legend1"
        lineChartPoints.color "green"
        lineChartPoints.data [
            [ lineChartDataPoint.x 20; lineChartDataPoint.y -9.0 ]
            [ lineChartDataPoint.x 25; lineChartDataPoint.y 14 ]
            [  lineChartDataPoint.x 30; lineChartDataPoint.y -14 ]
            [ lineChartDataPoint.x 35; lineChartDataPoint.y 23 ]
            [ lineChartDataPoint.x 40; lineChartDataPoint.y -20.0 ]
            [ lineChartDataPoint.x 45; lineChartDataPoint.y 31 ]
            [ lineChartDataPoint.x 50; lineChartDataPoint.y -29 ]
            [ lineChartDataPoint.x 55; lineChartDataPoint.y 27 ]
            [ lineChartDataPoint.x 60; lineChartDataPoint.y -37 ]
            [ lineChartDataPoint.x 65; lineChartDataPoint.y 51 ]
        ]
    ]
    [
        lineChartPoints.opacity 1.0
        lineChartPoints.color "orange"
        lineChartPoints.legend "legend2"
        lineChartPoints.data [
            [ lineChartDataPoint.x 20; lineChartDataPoint.y 21 ]
            [ lineChartDataPoint.x 25; lineChartDataPoint.y -25 ]
            [  lineChartDataPoint.x 30; lineChartDataPoint.y 10 ]
            [ lineChartDataPoint.x 35; lineChartDataPoint.y -10 ]
            [ lineChartDataPoint.x 40; lineChartDataPoint.y 14 ]
            [ lineChartDataPoint.x 45; lineChartDataPoint.y -18 ]
            [ lineChartDataPoint.x 50; lineChartDataPoint.y 9 ]
            [ lineChartDataPoint.x 55; lineChartDataPoint.y -23 ]
            [ lineChartDataPoint.x 60; lineChartDataPoint.y 7 ]
            [ lineChartDataPoint.x 65; lineChartDataPoint.y -55 ]
        ]
    ]
    [
        lineChartPoints.opacity 1.0
        lineChartPoints.color "purple"
        lineChartPoints.legend "legend3"
        lineChartPoints.data [
            [ lineChartDataPoint.x 20; lineChartDataPoint.y 30 ]
            [ lineChartDataPoint.x 25; lineChartDataPoint.y 35 ]
            [  lineChartDataPoint.x 30; lineChartDataPoint.y -33 ]
            [ lineChartDataPoint.x 35; lineChartDataPoint.y 40 ]
            [ lineChartDataPoint.x 40; lineChartDataPoint.y 10 ]
            [ lineChartDataPoint.x 45; lineChartDataPoint.y -40 ]
            [ lineChartDataPoint.x 50; lineChartDataPoint.y 34 ]
            [ lineChartDataPoint.x 55; lineChartDataPoint.y 40 ]
            [ lineChartDataPoint.x 60; lineChartDataPoint.y -60 ]
            [ lineChartDataPoint.x 65; lineChartDataPoint.y 40 ]
        ]
    ]
]

Fui.areaChart [
    areaChart.mode.tonexty
    areaChart.height 300
    areaChart.width 600
    areaChart.legendsOverflowText "Overflow Items"
    areaChart.yAxisTickFormat (fun (s:string) -> $"${s}")
    areaChart.svgProps [ prop.ariaLabel "This is another test?!"]
    areaChart.enableGradient true
    areaChart.enablePerfOptimization true
    areaChart.legendProps [
        legends.allowFocusOnLegends true
        legends.canSelectMultipleLegends true
        legends.centerLegends true
    ]
    areaChart.data [
        chart.chartTitle "Areachart"
        chart.lineChartData [
            yield! areaChartDataList
        ]
    ]
]