ScatterChart

let scatterChartData = [
    chart.chartTitle "Sales Performance by Category"
    chart.scatterChartData [
        [
            scatterChartPoints.legend "Region 1"
            scatterChartPoints.color Fui.dataVizPalette.color3
            scatterChartPoints.data [
                [ scatterChartDataPoint.x "Electronics"; scatterChartDataPoint.y 50000; scatterChartDataPoint.markerSize 25 ]
                [ scatterChartDataPoint.x "Furniture"; scatterChartDataPoint.y 30000; scatterChartDataPoint.markerSize 20 ]
                [ scatterChartDataPoint.x "Clothing"; scatterChartDataPoint.y 20000; scatterChartDataPoint.markerSize 15 ]
                [ scatterChartDataPoint.x "Toys"; scatterChartDataPoint.y 15000; scatterChartDataPoint.markerSize 10 ]
                [ scatterChartDataPoint.x "Books"; scatterChartDataPoint.y 10000; scatterChartDataPoint.markerSize 8 ]
            ]
        ]
        [
            scatterChartPoints.legend "Region 2"
            scatterChartPoints.color Fui.dataVizPalette.color4
            scatterChartPoints.data [
                [ scatterChartDataPoint.x "Electronics"; scatterChartDataPoint.y 60000; scatterChartDataPoint.markerSize 30 ]
                [ scatterChartDataPoint.x "Furniture"; scatterChartDataPoint.y 25000; scatterChartDataPoint.markerSize 18 ]
                [ scatterChartDataPoint.x "Clothing"; scatterChartDataPoint.y 22000; scatterChartDataPoint.markerSize 16 ]
                [ scatterChartDataPoint.x "Toys"; scatterChartDataPoint.y 12000; scatterChartDataPoint.markerSize 12 ]
                [ scatterChartDataPoint.x "Books"; scatterChartDataPoint.y 8000; scatterChartDataPoint.markerSize 6 ]
            ]
        ]
    ]
]

Fui.scatterChart [
    scatterChart.data scatterChartData
    scatterChart.height 400
    scatterChart.width 500
    scatterChart.xAxisTitle "Product Category"
    scatterChart.yAxisTitle "Revenue in dollars"
    scatterChart.styles [
        scatterChartStyles.svgTooltip "test-svg-styles"
    ]
]