apexcharts / Blazor-ApexCharts

A blazor wrapper for ApexCharts.js
https://apexcharts.github.io/Blazor-ApexCharts
MIT License
749 stars 88 forks source link

feat: add X Axis Label Formatter #462

Closed fabio-sp closed 1 month ago

fabio-sp commented 2 months ago

Summary

This PR adds the possibility to format X Axis labels using .NET (as users can already done with Y Axis Labels using the FormatYAxisLabel parameter of the ApexChart component).

This is particularly useful in those cases when using horizontal bar charts.

<ApexChart TItem="Order"
               Title="Order Net Value"
               FormatXAxisLabel="GetXAxisLabel"
               Options="options">
@* ... *@
</ApexChart>

@code
{

// ...

    private string GetXAxisLabel(decimal value)
    {
        return "$" + value.ToString("N0");
    }

// ...
}

Screenshots

image

Things to consider

This does not address a problem on the values shown in the tooltip shown on mouse hover; as far as I know, it looks like the problem is not related to the Blazor wrapper implementation but to the underlying Apex Charts Js library. An issues already exists for this: https://github.com/apexcharts/apexcharts.js/issues/4472

joadan commented 1 month ago

Thank you!