ChartJS.Blazor Error in blazor wasm

Question

Hi,
I would to use charjs.blazor to make the stacked chart with Xtime Axis.
I've put below the code and the error message that's received. I think that the problem becomes of the TimeAxis set up.
have you an idea?

  private BarConfig _config;
    private Chart _chart;

    protected override void OnInitialized()
    {
        _config = new BarConfig
        {
            Options = new BarOptions
            {
                Responsive = true,
                Title = new OptionsTitle
                {
                    Display = true,
                    Text = "Chart.js Bar Chart - Stacked"
                },

                Tooltips = new Tooltips
                {
                    Mode = InteractionMode.Index,
                    Intersect = false
                },

                Scales = new BarScales
                {
                    XAxes = new List<CartesianAxis>
{
                       new BarTimeAxis
                       {
                        Stacked=true,

                        Time = new TimeOptions
                            {
                                Unit = TimeMeasurement.Month
                            }
                        }
                    },

                    YAxes = new List<CartesianAxis>
{
                        new BarLinearCartesianAxis
                        {
                            Stacked = true,
                        }
                    }
                }
            }

        };

        BarDataset<int> dataset1 = new BarDataset<int>(new[] { 6, 5, 3, 7,5,10 })
        {
            Label = "Dataset 1",
            BackgroundColor = ColorUtil.FromDrawingColor(System.Drawing.Color.Red)
        };

        BarDataset<int> dataset2 = new BarDataset<int>(new[] { 4, 10, 2, 7,1,2 })
        {
            Label = "Dataset 2",
            BackgroundColor = ColorUtil.FromDrawingColor(System.Drawing.Color.Green)
        };

        _config.Data.Datasets.Add(dataset1);
        _config.Data.Datasets.Add(dataset2);

        DateTime today = DateTime.Now;
        var labels = Enumerable.Range(0, 6)
                               .Select(i => today.AddMonths(i).ToString("o"));

        foreach (var label in labels)
        {
            _config.Data.Labels.Add(label);
        }

I receive the error message :

Microsoft.JSInterop.JSException: This method is not implemented: either no adapter can be found or an incomplete integration was provided.
Error: This method is not implemented: either no adapter can be found or an incomplete integration was provided.
    at an.nn (https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js:7:112166)
    at n.update (https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js:7:146969)
    at ce (https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js:7:80458)
    at Object.update (https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js:7:82417)
    at tn.updateLayout (https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js:7:106313)
    at tn.update (https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js:7:105922)
    at tn.construct (https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js:7:102923)
    at new tn (https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js:7:102287)
    at ChartJsInterop.setupChart (https://localhost:44305/_content/ChartJs.Blazor.Fork/ChartJsBlazorInterop.js:9:25)
    at https://localhost:44305/_framework/blazor.webassembly.js:1:3942
   at Microsoft.JSInterop.JSRuntime.<InvokeAsync>d__15`1[[System.Boolean, System.Private.CoreLib, Version=5.0.0.0, Culture=neutral, PublicKeyToken=7cec85d7bea7798e]].MoveNext()
   at ChartJs.Blazor.Chart.OnAfterRenderAsync(Boolean firstRender)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle)
'iisexpress.exe' (CoreCLR: clrhost) : Chargé 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\5.0.12\System.Buffers.dll'. Chargement des symboles ignoré. Le module est optimisé et l'option du débogueur 'Uniquement mon code' est activée.
Uncaught TypeError: Cannot read properties of undefined (reading 'skip')Uncaught TypeError: Cannot read properties of undefined (reading 'skip')Uncaught TypeError: Cannot read properties of undefined (reading 'skip')Uncaught TypeError: Cannot read properties of undefined (reading 'skip')Uncaught TypeError: Cannot read properties of undefined (reading 'skip')Uncaught TypeError: Cannot read properties of undefined (reading 'skip')Uncaught TypeError: Cannot read properties of undefined (reading 'skip')Uncaught TypeError: Cannot read properties of undefined (reading 'skip')Uncaught TypeError: Cannot read properties of undefined (reading 'skip')Uncaught TypeError: Cannot read properties of undefined (reading 'skip')Uncaught TypeError: Cannot read properties of undefined (reading 'skip')Uncaught TypeError: Cannot read properties of undefined (reading 'skip')mono_wasm_runtime_ready fe00e07a-5519-4dfe-b35a-f867dbaf2e28
Le thread 0x0 s'est arrêté avec le code 0 (0x0).
Le programme 'localhost:44305' s'est arrêté avec le code -1 (0xffffffff).
Le programme '' s'est arrêté avec le code -1 (0xffffffff).
Le programme '[20024] iisexpress.exe' s'est arrêté avec le code -1 (0xffffffff).

Answer 1

Hi @sblb ,

Do you mean you are using this ChartJs.Blazor?

If that is the case, please check the readme document:

First, you need to meet the prerequisites: an IDE that supports Blazor and .NET Core SDK 3.x+.

Second, if you are using a time scale (TimeAxis), you also need to include Moment.js before including Chart.js.

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>  

Refer to this similar issue: LineChart with TimeAxis don't work after update to 2.0.0

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Best regards,
Dillion