search

mariusmuntean / ChartJs.Blazor

Brings Chart.js charts to Blazor
https://www.iheartblazor.com/
MIT License
691 stars 152 forks source link

scatterChart stops as toExponential() called with illegal argument #77

Closed gy6248 closed 3 years ago

gy6248 commented 4 years ago

Describe the bug

For some combinations of points with small Y value the scatterChart will cause a crash. It seems to relate to the auto scaling of the Y axis, specifically the formatting of the numbers on the Y-axis.

I have included the four point triggering an error in my installation below. Changing the Y-value on the second OR third number to E-04/ E-05 respectively will make the curve plot OK.

Which Blazor project type is your bug related to?

Which charts does this bug apply to?

ChartJsScatterChart

To Reproduce

Steps to reproduce the behavior:

  1. Using this version of ChartJSBlazor 1.0.3

  2. Run this code Use the scatterChart sample code, but add only one curve with four points

  3. With these arguments '....'.

  4. See error.

Expected behavior

Draw the curve

Screenshots

If applicable, add screenshots to help explain your problem.

Additional context / logging

Add any other context about the problem here.

[2020-02-10T12:22:14.707Z] Information: WebSocket connected to wss://localhost:44379/_blazor?id=tf3PtwnSTeM88X1Vw0sSNw. 'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Users\gy6248\source\repos\ChartJs.Blazor\ChartJs.Blazor-master\samples\ServerSide\ChartJs.Blazor.Sample.ServerSide\bin\Debug\netcoreapp3.1\ChartJs.Blazor.dll'. Symbols loaded. 'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\3.1.0\Microsoft.CSharp.dll'. Skipped loading symbols. Module is optimized and the debugger option 'Just My Code' is enabled. 'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Users\gy6248\source\repos\ChartJs.Blazor\ChartJs.Blazor-master\samples\ServerSide\ChartJs.Blazor.Sample.ServerSide\bin\Debug\netcoreapp3.1\Newtonsoft.Json.dll'. Skipped loading symbols. Module is optimized and the debugger option 'Just My Code' is enabled. 'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\3.1.0\System.Runtime.Serialization.Formatters.dll'. Skipped loading symbols. Module is optimized and the debugger option 'Just My Code' is enabled. 'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\3.1.0\System.Diagnostics.TraceSource.dll'. Skipped loading symbols. Module is optimized and the debugger option 'Just My Code' is enabled. 'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\3.1.0\System.Runtime.Serialization.Primitives.dll'. Skipped loading symbols. Module is optimized and the debugger option 'Just My Code' is enabled. 'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\3.1.0\System.Runtime.Numerics.dll'. Skipped loading symbols. Module is optimized and the debugger option 'Just My Code' is enabled. 'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\3.1.0\System.Data.Common.dll'. Skipped loading symbols. Module is optimized and the debugger option 'Just My Code' is enabled. Exception thrown: 'Microsoft.JSInterop.JSException' in System.Private.CoreLib.dll 'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\3.1.0\System.Diagnostics.StackTrace.dll'. Skipped loading symbols. Module is optimized and the debugger option 'Just My Code' is enabled. 'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\3.1.0\System.Reflection.Metadata.dll'. Skipped loading symbols. Module is optimized and the debugger option 'Just My Code' is enabled. 'iisexpress.exe' (CoreCLR: clrhost): Loaded 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\3.1.0\System.Collections.Immutable.dll'. Skipped loading symbols. Module is optimized and the debugger option 'Just My Code' is enabled. Microsoft.AspNetCore.Components.Server.Circuits.RemoteRenderer: Warning: Unhandled exception rendering component: toExponential() argument must be between 0 and 100 RangeError: toExponential() argument must be between 0 and 100 at Number.toExponential () at i.linear (https://localhost:44379/_content/ChartJs.Blazor/Chart.min.js:7:102036) at Array.map () at i.convertTicksToLabels (https://localhost:44379/_content/ChartJs.Blazor/Chart.min.js:7:105530) at i.convertTicksToLabels (https://localhost:44379/_content/ChartJs.Blazor/Chart.min.js:7:117293) at i.update (https://localhost:44379/_content/ChartJs.Blazor/Chart.min.js:7:104107) at https://localhost:44379/_content/ChartJs.Blazor/Chart.min.js:7:71859 at Object.each (https://localhost:44379/_content/ChartJs.Blazor/Chart.min.js:7:23303) at Object.update (https://localhost:44379/_content/ChartJs.Blazor/Chart.min.js:7:71762) at ni.updateLayout (https://localhost:44379/_content/ChartJs.Blazor/Chart.min.js:7:96121)

\\ Put your error log here

Code example

// I put this in PointUtil.cs
  public static List<Point> ScatterBug()
        {
            List<Point> points = new List<Point>
            {
                new Point(78.775, -2.78E-05),
                new Point(79.18666667, -1.96E-05),
                new Point(79.59833333, 8.36E-06),
                new Point(80.01, 2.58E-05)
            };
            return points;
        }

//Changes to ScatterChartComponent.razor:
//remove two default datasets from OnInitialize

// Add the four point triggering error:
public async Task OnClick()
    {
        _config.Data.Datasets.Add(new ScatterDataset
        {
            Data =  PointUtil.ScatterBug(),
            BackgroundColor = ColorUtil.RandomColorString(),
            BorderColor = ColorUtil.RandomColorString(),
            ShowLine = true,
            PointRadius = 0,
            PointHitRadius = 5,
            PointHoverRadius = 8
        });

        await _scatterChartJs.Update();
    }

\\ Put your example code here
gy6248 commented 4 years ago

I think the bug is in chart.min.js and it appears to have been fixed in Chart.js v2.9.3 Blazor ChartJs 1.0.3 includes v2.8.0 of this file. With the new chart.min.js file my curve was drawn OK.

Joelius300 commented 4 years ago

Thanks for the report!

As you already mentioned in your second comment, I don't think this is an issue with our library but a bug inside chartjs. However, we're currently on 2.8 and not 2.9. There are some changes for our library when upgrading but it should be done as soon as possible.

Working aroundd this issue shouldn't be too hard though. Just include the new version of chart.js and if there are breaking changes which we haven't adapted to yet, file an issue; it'll greatly help us upgrade!

Once again I have to mention that I don't have time to actively maintain this library at the moment. I don't know if @mariusmuntean will be able to pick up work again or if it'll stay in this state for a while (I hope you'd understand as this is all voluntary, unpaid work). Unfortunately, I don't know when I will get more free time to invest in this project.

Joelius300 commented 4 years ago

I will close this issue once we officially support Chart.js 2.9. This should be the case in Version 2.0 in which we'll remove the bundled version of Chart.js from this library.

Joelius300 commented 3 years ago

I'm closing this now as 2.0 is almost done and will be released soon.