-
Notifications
You must be signed in to change notification settings - Fork 7
HorizontalBarChartWithAxis
Andrew Sutton edited this page Oct 15, 2025
·
2 revisions

let horizontalBarWithAxisData = [
[
horizontalBarChartWithAxisDataPoint.y "String One"
horizontalBarChartWithAxisDataPoint.x 1000
horizontalBarChartWithAxisDataPoint.color (Fui.getColorFromToken Fui.dataVizPalette.color1)
]
[
horizontalBarChartWithAxisDataPoint.y "String Two"
horizontalBarChartWithAxisDataPoint.x 5000
horizontalBarChartWithAxisDataPoint.color (Fui.getColorFromToken Fui.dataVizPalette.color2)
]
[
horizontalBarChartWithAxisDataPoint.y "String Three"
horizontalBarChartWithAxisDataPoint.x 3000
horizontalBarChartWithAxisDataPoint.color (Fui.getColorFromToken Fui.dataVizPalette.color3)
]
[
horizontalBarChartWithAxisDataPoint.y "String Four"
horizontalBarChartWithAxisDataPoint.x 2000
horizontalBarChartWithAxisDataPoint.color (Fui.getColorFromToken Fui.dataVizPalette.color4)
]
]
Fui.horizontalBarChartWithAxis [
horizontalBarChartWithAxis.data horizontalBarWithAxisData
horizontalBarChartWithAxis.chartTitle "Horizontal bar chart axis tooltip example"
horizontalBarChartWithAxis.height 350
horizontalBarChartWithAxis.width 650
horizontalBarChartWithAxis.hideLegend true
horizontalBarChartWithAxis.hideTooltip false
horizontalBarChartWithAxis.showYAxisLablesTooltip false
horizontalBarChartWithAxis.showYAxisLables true
horizontalBarChartWithAxis.enableGradient true
horizontalBarChartWithAxis.roundCorners true
horizontalBarChartWithAxis.onRenderCalloutPerDataPoint (fun props ->
match props with
| Some p -> Fui.text $"{p.y}: {p.x}"
| None -> Html.none
)
]