Merge pull request #412 from LayTec-AG/feature/lazy-loading

Use lazy loading and bump plotly.js to v2.29.1
LayTec-AG · Mar 4, 2024 · 415fc3d · 415fc3d
2 parents c55d532 + 14ffc7c
commit 415fc3d
Show file tree

Hide file tree

Showing 31 changed files with 984 additions and 733 deletions.
diff --git a/Directory.Packages.props b/Directory.Packages.props
@@ -12,26 +12,26 @@
     <PackageVersion Include="Microsoft.CSharp" Version="4.7.0" />
   </ItemGroup>
   <ItemGroup>
-    <PackageVersion Condition="'$(TargetFramework)' == 'net6.0'" Include="Microsoft.AspNetCore.Components" Version="6.0.25" />
-    <PackageVersion Condition="'$(TargetFramework)' == 'net6.0'" Include="Microsoft.AspNetCore.Components.Web" Version="6.0.25" />
-    <PackageVersion Condition="'$(TargetFramework)' == 'net6.0'" Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.25" />
-    <PackageVersion Condition="'$(TargetFramework)' == 'net6.0'" Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.25" PrivateAssets="all" />
-    <PackageVersion Condition="'$(TargetFramework)' == 'net7.0'" Include="Microsoft.AspNetCore.Components" Version="7.0.14" />
-    <PackageVersion Condition="'$(TargetFramework)' == 'net7.0'" Include="Microsoft.AspNetCore.Components.Web" Version="7.0.14" />
-    <PackageVersion Condition="'$(TargetFramework)' == 'net7.0'" Include="Microsoft.AspNetCore.Components.WebAssembly" Version="7.0.14" />
-    <PackageVersion Condition="'$(TargetFramework)' == 'net7.0'" Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="7.0.14" PrivateAssets="all" />
-    <PackageVersion Condition="'$(TargetFramework)' == 'net8.0'" Include="Microsoft.AspNetCore.Components" Version="8.0.0" />
-    <PackageVersion Condition="'$(TargetFramework)' == 'net8.0'" Include="Microsoft.AspNetCore.Components.Web" Version="8.0.0" />
-    <PackageVersion Condition="'$(TargetFramework)' == 'net8.0'" Include="Microsoft.AspNetCore.Components.WebAssembly" Version="8.0.0" />
-    <PackageVersion Condition="'$(TargetFramework)' == 'net8.0'" Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="8.0.0" PrivateAssets="all" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net6.0'" Include="Microsoft.AspNetCore.Components" Version="6.0.27" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net6.0'" Include="Microsoft.AspNetCore.Components.Web" Version="6.0.27" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net6.0'" Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.27" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net6.0'" Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.27" PrivateAssets="all" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net7.0'" Include="Microsoft.AspNetCore.Components" Version="7.0.16" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net7.0'" Include="Microsoft.AspNetCore.Components.Web" Version="7.0.16" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net7.0'" Include="Microsoft.AspNetCore.Components.WebAssembly" Version="7.0.16" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net7.0'" Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="7.0.16" PrivateAssets="all" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net8.0'" Include="Microsoft.AspNetCore.Components" Version="8.0.2" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net8.0'" Include="Microsoft.AspNetCore.Components.Web" Version="8.0.2" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net8.0'" Include="Microsoft.AspNetCore.Components.WebAssembly" Version="8.0.2" />
+    <PackageVersion Condition="'$(TargetFramework)' == 'net8.0'" Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="8.0.2" PrivateAssets="all" />
     <PackageVersion Include="MudBlazor" Version="6.11.1" />
     <PackageVersion Include="Newtonsoft.Json" Version="13.0.3" />
     <PackageVersion Include="PublishSPAforGitHubPages.Build" Version="2.1.0" />
     <PackageVersion Include="Stubble.Core" Version="1.10.8" />
-    <PackageVersion Include="WeCantSpell.Hunspell" Version="4.1.0" />
+    <PackageVersion Include="WeCantSpell.Hunspell" Version="5.0.0" />
     <PackageVersion Include="FluentAssertions" Version="6.12.0" />
     <PackageVersion Include="nunit" Version="3.14.0" />
     <PackageVersion Include="NUnit3TestAdapter" Version="4.5.0" />
-    <PackageVersion Include="Microsoft.NET.Test.Sdk" Version="17.8.0" />
+    <PackageVersion Include="Microsoft.NET.Test.Sdk" Version="17.9.0" />
   </ItemGroup>
 </Project>
diff --git a/Plotly.Blazor.Examples/Helper.cs b/Plotly.Blazor.Examples/Helper.cs
@@ -1,13 +1,42 @@
-using System;
-using System.Collections.Generic;
-using System.Diagnostics.CodeAnalysis;
+using System.Diagnostics.CodeAnalysis;
 using Plotly.Blazor.Traces;
 
 namespace Plotly.Blazor.Examples
 {
     public static class Helper
     {
-        private static Random Random => new Random();
+        private static Random Random => new();
+
+        /// <summary>
+        ///     Adds data to an IList.
+        /// </summary>
+        /// <typeparam name="T"></typeparam>
+        /// <param name="list"></param>
+        /// <param name="items"></param>
+        public static void AddRange<T>(this IList<T> list, IEnumerable<T> items)
+        {
+            if (list == null)
+            {
+                throw new ArgumentNullException(nameof(list));
+            }
+
+            if (items == null)
+            {
+                throw new ArgumentNullException(nameof(items));
+            }
+
+            if (list is List<T> asList)
+            {
+                asList.AddRange(items);
+            }
+            else
+            {
+                foreach (var item in items)
+                {
+                    list.Add(item);
+                }
+            }
+        }
 
         /// <summary>
         ///     Generates the data.

diff --git a/Plotly.Blazor.Examples/wwwroot/index.html b/Plotly.Blazor.Examples/wwwroot/index.html
@@ -29,11 +29,7 @@
         <a href="" class="reload">Reload</a>
         <a class="dismiss">🗙</a>
     </div>
-    <!-- Import the plotly.js library -->
-    <script src="_content/Plotly.Blazor/plotly-latest.min.js" type="text/javascript"></script>
-    <!-- Import the plotly.js interop functions -->
-    <script src="_content/Plotly.Blazor/plotly-interop.js" type="text/javascript"></script>
-
+
     <script src="_content/MudBlazor/MudBlazor.min.js"></script>
 
     <script src="js/highlight.min.js"></script>

diff --git a/Plotly.Blazor.Generator/CustomDic.txt b/Plotly.Blazor.Generator/CustomDic.txt
@@ -326,4 +326,7 @@ minreducedwidth=minReducedWidth
 quartiles=quartiles
 sdmultiple=sdMultiple
 autorangeoptions=autoRangeOptions
-includesrc=includeSrc
+includesrc=includeSrc
+hovercolorsrc=hoverColorSrc
+autotickangles=autoTickAngles
+barcornerradius=barCornerRadius
diff --git a/Plotly.Blazor.Generator/Program.cs b/Plotly.Blazor.Generator/Program.cs
@@ -28,7 +28,7 @@ namespace Plotly.Blazor.Generator
     internal class Program
     {
         private const string NAMESPACE = "Plotly.Blazor";
-        private const string PLOTLY_JS_URL = "https://cdn.plot.ly/plotly-2.27.1.min.js";
+        private const string PLOTLY_JS_URL = "https://cdn.plot.ly/plotly-2.29.1.min.js";
 
         private static SchemaRoot _schema;
         private static StubbleVisitorRenderer _stubble;

diff --git a/Plotly.Blazor.Generator/src/Extensions.cs b/Plotly.Blazor.Generator/src/Extensions.cs
@@ -6,11 +6,9 @@
 using System.Text.Json;
 using System.Text.Json.Serialization;
 
-#pragma warning disable 1591
-
 namespace Plotly.Blazor
 {
-    public static class Extensions
+    internal static class Extensions
     {
         /// <summary>
         ///     Adds data to an IList.

diff --git a/Plotly.Blazor.Generator/src/PlotlyChart.razor b/Plotly.Blazor.Generator/src/PlotlyChart.razor
@@ -1,10 +1 @@
-@inject IJSRuntime JsRuntime
-@using Microsoft.JSInterop
-@using System.Text.Json
-@using System.Collections
-@using Plotly.Blazor.Interop
-@using System.Threading
-@using Plotly.Blazor;
-@implements IDisposable
-
-<div style="min-height: 350px; height: 100%" @attributes="AdditionalAttributes" id="@Id"></div>
+<div style="min-height: 350px; height: 100%" @attributes="AdditionalAttributes" id="@Id"></div>
diff --git a/Plotly.Blazor.Generator/src/PlotlyChart.razor.cs b/Plotly.Blazor.Generator/src/PlotlyChart.razor.cs
@@ -88,17 +88,25 @@ public partial class PlotlyChart
         [Parameter]
         public Action AfterRender { get; set; }
 
-        /// <summary>
-        ///     Can be used later to invoke methods from javaScript to .NET.
-        /// </summary>
-        private DotNetObjectReference<PlotlyChart> objectReference;
+        [Inject]
+        private IJSRuntime JsRuntime { get; set; }
+        private PlotlyJsInterop Interop { get; set; }
+
         /// <inheritdoc/>
         protected override bool ShouldRender() => false;
+
+        /// <inheritdoc />
+        protected override void OnInitialized()
+        {
+            Interop = new PlotlyJsInterop(JsRuntime, this);
+            base.OnInitialized();
+        }
+
         /// <inheritdoc/>
         public override async Task SetParametersAsync(ParameterView parameters)
         {
             await base.SetParametersAsync(parameters);
-            objectReference ??= DotNetObjectReference.Create(this);
+
             if (string.IsNullOrWhiteSpace(Id))
             {
                 var random = new Random();
@@ -150,7 +158,7 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
         /// <returns>Task</returns>
         public async Task React(CancellationToken cancellationToken = default)
         {
-            await JsRuntime.React(objectReference, cancellationToken);
+            await Interop.React(cancellationToken);
         }
 
         /// <summary>
@@ -160,7 +168,26 @@ public async Task React(CancellationToken cancellationToken = default)
         /// <returns>Task</returns>
         public async Task Relayout(CancellationToken cancellationToken = default)
         {
-            await JsRuntime.Relayout(objectReference, cancellationToken);
+            await Interop.Relayout(cancellationToken);
+        }
+
+        /// <summary>
+        ///     Updates the chart layout partially using the given <paramref name="value"/> properties.
+        ///     <paramref name="value"/> can be an anonymous type.
+        /// </summary>
+        /// <param name="value">Partial update values</param>
+        /// <param name = "cancellationToken">CancellationToken</param>
+        /// <returns>Task</returns>
+        public async Task Relayout<T>(T value, CancellationToken cancellationToken = default)
+        {
+            if (value.Equals(default)) return;
+
+            Layout ??= new Layout();
+
+            var json = JsonSerializer.Serialize(value.PrepareJsInterop(PlotlyJsInterop.SerializerOptions));
+            Layout.Populate(json, PlotlyJsInterop.SerializerOptions); // apply changes to the existing object
+
+            await Interop.Relayout(value, cancellationToken);
         }
 
         /// <summary>
@@ -207,7 +234,7 @@ public async Task Restyle(ITrace trace, int index, CancellationToken cancellatio
         /// <returns>A binary string of the exported image</returns>
         public async Task<string> ToImage(ImageFormat format, uint height, uint width, CancellationToken cancellationToken = default)
         {
-            return await JsRuntime.ToImage(objectReference, format, height, width, cancellationToken);
+            return await Interop.ToImage(format, height, width, cancellationToken);
         }
 
         /// <summary>
@@ -221,7 +248,7 @@ public async Task<string> ToImage(ImageFormat format, uint height, uint width, C
         /// <returns>Task</returns>
         public async Task DownloadImage(ImageFormat format, uint height, uint width, string fileName, CancellationToken cancellationToken = default)
         {
-            await JsRuntime.DownloadImage(objectReference, format, height, width, fileName, cancellationToken);
+            await Interop.DownloadImage(format, height, width, fileName, cancellationToken);
         }
 
         /// <summary>
@@ -261,7 +288,7 @@ public async Task Restyle(ITrace trace, IEnumerable<int> indices, CancellationTo
                 currentTrace.Populate(json, PlotlyJsInterop.SerializerOptions); // apply changes to the existing object
             }
 
-            await JsRuntime.Restyle(objectReference, trace, absoluteindices.ToArray(), cancellationToken);
+            await Interop.Restyle(trace, absoluteindices.ToArray(), cancellationToken);
         }
 
         /// <summary>
@@ -281,7 +308,7 @@ public async Task Update(CancellationToken cancellationToken = default)
         /// <returns></returns>
         public async Task NewPlot(CancellationToken cancellationToken = default)
         {
-            await JsRuntime.NewPlot(objectReference, cancellationToken);
+            await Interop.NewPlot(cancellationToken);
         }
 
         /// <summary>
@@ -311,7 +338,7 @@ public async Task AddTrace(ITrace trace, int? index = null, CancellationToken ca
             }
 
             await DataChanged.InvokeAsync(Data);
-            await JsRuntime.AddTrace(objectReference, trace, index, cancellationToken);
+            await Interop.AddTrace(trace, index, cancellationToken);
         }
 
         /// <summary>
@@ -362,7 +389,7 @@ public async Task DeleteTrace(int index, CancellationToken cancellationToken = d
 
             Data.RemoveAt(index);
             await DataChanged.InvokeAsync(Data);
-            await JsRuntime.DeleteTrace(objectReference, index, cancellationToken);
+            await Interop.DeleteTrace(index, cancellationToken);
         }
 
         /// <summary>
@@ -484,7 +511,7 @@ public async Task ExtendTraces(IEnumerable<IEnumerable<object>> x, IEnumerable<I
             }
 
             await DataChanged.InvokeAsync(Data);
-            await JsRuntime.ExtendTraces(objectReference, xArr, yArr, indicesArr, max, cancellationToken);
+            await Interop.ExtendTraces(xArr, yArr, indicesArr, max, cancellationToken);
         }
 
         private static void AddDataToProperty(object currentTrace, Type traceType, string propertyName, IReadOnlyCollection<object> data, int? max, bool prepend)
@@ -494,7 +521,7 @@ private static void AddDataToProperty(object currentTrace, Type traceType, strin
                 return;
             }
 
-            var list = (IList<object>)traceType.GetProperty(propertyName)?.GetValue(currentTrace) 
+            var list = (IList<object>)traceType.GetProperty(propertyName)?.GetValue(currentTrace)
                        ?? throw new InvalidOperationException($"You must first initialise the {propertyName} list before it can be expanded, e.g. by using Plotly.Update");
 
             if (prepend)
@@ -634,7 +661,7 @@ public async Task PrependTraces(IEnumerable<IEnumerable<object>> x, IEnumerable<
             }
 
             await DataChanged.InvokeAsync(Data);
-            await JsRuntime.PrependTraces(objectReference, xArr, yArr, indicesArr, max, cancellationToken);
+            await Interop.PrependTraces(xArr, yArr, indicesArr, max, cancellationToken);
         }
 
         /// <summary>
@@ -713,7 +740,7 @@ public void RelayoutEvent(RelayoutEventData obj)
         /// <returns>Task</returns>
         public async Task SubscribeLegendClickEvent(CancellationToken cancellationToken = default)
         {
-            await JsRuntime.SubscribeLegendClickEvent(objectReference, cancellationToken);
+            await Interop.SubscribeLegendClickEvent(cancellationToken);
         }
 
         /// <summary>
@@ -723,7 +750,7 @@ public async Task SubscribeLegendClickEvent(CancellationToken cancellationToken
         /// <returns>Task</returns>
         public async Task SubscribeClickEvent(CancellationToken cancellationToken = default)
         {
-            await JsRuntime.SubscribeClickEvent(objectReference, cancellationToken);
+            await Interop.SubscribeClickEvent(cancellationToken);
         }
 
         /// <summary>
@@ -733,7 +760,7 @@ public async Task SubscribeClickEvent(CancellationToken cancellationToken = defa
         /// <returns>Task</returns>
         public async Task SubscribeHoverEvent(CancellationToken cancellationToken = default)
         {
-            await JsRuntime.SubscribeHoverEvent(objectReference, cancellationToken);
+            await Interop.SubscribeHoverEvent(cancellationToken);
         }
 
         /// <summary>
@@ -743,7 +770,7 @@ public async Task SubscribeHoverEvent(CancellationToken cancellationToken = defa
         /// <returns>Task</returns>
         public async Task SubscribeRelayoutEvent(CancellationToken cancellationToken = default)
         {
-            await JsRuntime.SubscribeRelayoutEvent(objectReference, cancellationToken);
+            await Interop.SubscribeRelayoutEvent(cancellationToken);
         }
 
         /// <summary>
@@ -773,13 +800,7 @@ public async Task Purge(CancellationToken cancellationToken = default)
             await ConfigChanged.InvokeAsync(Config);
             Frames.Clear();
             await FramesChanged.InvokeAsync(Frames);
-            await JsRuntime.Purge(objectReference, cancellationToken);
-        }
-
-        /// <inheritdoc/>
-        public void Dispose()
-        {
-            objectReference?.Dispose();
+            await Interop.Purge(cancellationToken);
         }
     }
 }