apexcharts / Blazor-ApexCharts

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

Register and using Localization #466

Open QuentinBubu opened 1 month ago

QuentinBubu commented 1 month ago

Hi,

I apologize, but when I wanted to change location, an error was generated by JS. I create a class named ChartLocaleFr like that :

    public class ChartLocaleFr : ChartLocale
    {
        public string Name = "fr";

        public LocaleOptions Options = new LocaleOptions
        {
            Days = new List<string> { "dimanche", "lundi", "mardi", "mercredi", "vendredi", "samedi" },
            Months = new List<string> { "janvier", "février", "mars", "avril", "mai", "juin", "juillet", "août", "septembre", "octobre", "novembre", "décembre" },
            ShortDays = new List<string> { "dim.", "lun.", "mar.", "mer.", "jeu.", "ven.", "sam." },
            ShortMonths = new List<string> { "janv.", "févr.", "mars", "avr.", "mai", "juin", "juill.", "août", "sept.", "oct.", "nov.", "déc." },
            Toolbar = new LocaleToolbar
            {
                Menu = "Menu",
                Pan = "Navigation",
                Reset = "Réinitialiser le zoom",
                Selection = "Sélection",
                SelectionZoom = "Sélection et zoom",
                ZoomIn = "Zoomer",
                ZoomOut = "Dézoomer",
                ExportToCSV = "Télécharger au format CSV",
                ExportToPNG = "Télécharger au format PNG",
                ExportToSVG = "Télécharger au format SVG"
            }
        };
    }

and I initialize a static instance (public static ChartLocaleFr ChartLocaleFrInstance { get; set; } = new ChartLocaleFr();).

In my extension, I create a new list of locales and setting up this static instance as DefaultLocale

            if (chart.ChartOptions.Chart.Locales is null)
            {
                chart.ChartOptions.Chart.Locales = new List<ChartLocale>();
            }

            chart.ChartOptions.Chart.Locales.Add(ChartLocaleFrInstance);

            chart.ChartOptions.Chart.DefaultLocale = ChartLocaleFrInstance.Name; // same error with "fr" directly

In Blazor, during generation, this error is generated by JavaScript : Uncaught (in promise) Error: Wrong locale name provided. Please make sure you set the correct locale name in options.

I've register local in array with chart.ChartOptions.Chart.Locales.Add(ChartLocaleFrInstance);

defaultLocale [...] and the selected locale has to be present in the locales array

And call correct (normally) name (ChartLocaleFrInstance.Name).

If I remove

            if (chart.ChartOptions.Chart.Locales is null)
            {
                chart.ChartOptions.Chart.Locales = new List<ChartLocale>();
            }

I have this error genereted by C# System.NullReferenceException : 'Object reference not set to an instance of an object.' on chart.ChartOptions.Chart.Locales.Add(ChartLocaleFrInstance);

So, I've missed somethings or It's a bug ?

Best regards, Quentin

FlorianGG commented 1 month ago

Same problem

Raceeend commented 3 weeks ago

Must that not be 'fr-FR' as local name?

QuentinBubu commented 3 weeks ago

Unfortunately, no I followed the instructions given here https://apexcharts.com/docs/localization/ And also tried with fr-FR but it doesn't change anything :c