Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add samples for formatters and tooltip templates #33

Closed
joadan opened this issue Nov 1, 2021 · 6 comments
Closed

Add samples for formatters and tooltip templates #33

joadan opened this issue Nov 1, 2021 · 6 comments

Comments

@joadan
Copy link
Member

joadan commented Nov 1, 2021

No description provided.

@AzureGulf
Copy link

Have just started using your charts today - looks good.
Please add a few simple examples for things like formatting the Y axis labels - I've tried formatting with standard C# strings such as "N0" (to get zero decimal places and comma delimiter) but no luck, so far...
And, is the YValue/Aggregrate always 'decimal', can't I have other value types on the Y axis?

@joadan
Copy link
Member Author

joadan commented Nov 23, 2021

The formaters are javascript functions, please see the samples in the Apex documentation, https://apexcharts.com/docs/formatting-axes-labels/

The Line samples Datetime do contains examples of Y value tooltip.

The data type for Y axis is decimal, but you should be able convert a numeric type to it. Please let me know if you have a use case where this is not working.

For zeros decimal places you can use the option DecimalsInFloat, this is also in the Datetime sample

options.Yaxis.Add(new YAxis
            {
                DecimalsInFloat = 0,
                Labels = new AxisLabels { Rotate = -45, Style = new AxisLabelStyle { FontSize = "10px" } },
                Title = new AxisTitle { Text = "Value", Style = new AxisTitleStyle { FontSize = "14px", Color = "lightgrey" } }
            });

@AzureGulf
Copy link

AzureGulf commented Nov 24, 2021

Thanks for your comment and pointers.
Most Y axes can be formatted to the local culture, so "en-us" would show a (currency) value of 300000.00 as $300,000.00 whereas in "fr" it would be €300 000,00 and so on...

Numeric values should also follow the same formatting rules (for example as defined by the N formatter). I'd also expect numbers to be similarly formatted within the tooltip.

My comment on the Y axis type was simply to question why it was fixed as decimal - what happens if you want to invert the X and Y axes? Say, as per your first Line chart example, so that Y axis is now the Country and X is the value.

@joadan
Copy link
Member Author

joadan commented Nov 26, 2021

I agree on the formatters, only having javascript functions is really limiting. I'll raise a separate issue for tracking this.

For the Y decimal value, should not be a problem, if you want to invert the Axis you set up the chart as normal and then flip the axis, see Horizontal demo here https://apexcharts.github.io/Blazor-ApexCharts/bar-charts

@AzureGulf
Copy link

AzureGulf commented Nov 26, 2021

For the Y decimal value, should not be a problem, if you want to invert the Axis you set up the chart as normal and then flip the axis, see Horizontal demo here https://apexcharts.github.io/Blazor-ApexCharts/bar-charts

thanks - I missed that!

@joadan
Copy link
Member Author

joadan commented Jan 24, 2022

Clean up

@joadan joadan closed this as completed Jan 24, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants