更新源数据时，plotly blazor 曲面图不会刷新

Question

我正在开发一个 blazor 服务器端应用程序，以使用plotly.blazor 在 3D 曲面图中显示测试数据，并且如果用户选择显示不同的数据集，我需要能够更新绘图。首次创建页面时，曲面图使用默认测试数据正确呈现，但是当我使用组合框选择不同的数据集时，绘图会显示为二维且空白，并带有旧标题(我在添加新标题之前清除数据)表面数据集，我用新标题等更新布局。

我已经单步执行了代码，我知道新数据都在那里并且正确，但由于某种原因，@data-Bind =“data”可能没有被触发？但令人困惑的是，当我使用 Chart.Clear() 时它会被触发...

我尝试过chart.React()，但没有什么区别。到目前为止，唯一解决这个问题的是刷新页面。

我的二维散点图没有这个问题。

旁注:我对 blazor 和plotly 都比较陌生。

以下节略代码:

@using Plotly.Blazor
@using Plotly.Blazor.Traces
@using Plotly.Blazor.LayoutLib
@using Plotly.Blazor.Traces.ScatterLib
@inject ResultsService resultsService

<PlotlyChart style="height: 100vh; min-height: 600px" @bind-Layout="layout3D_dBV" @bind-Config="config" Data="data" @ref="@cht_dBVvsFvsA" />

@code {

List<decimal> x = new List<decimal> {}; //populated in OnInitializedAsync
List<decimal> y = new List<decimal> {}; //populated in OnInitializedAsync
Layout layout3D_dBV = new Layout();
Config config = new Config();
List<decimal[]> z;
IList<ITrace> data= new List<ITrace>();
string selectedZ = "mV";

private PlotlyChart cht_dBVvsFvsA;

private async Task Replot() //this code fires on button click to update plots
{
    await cht_dBVvsFvsA.Clear();        
    ConfigureLayout();
    data.Clear();
    z.Clear();        
    Get3DplotData();        
}

private void ConfigureLayout()
{        
    layout3D_dBV = new Layout
    {
        Title = new Title
        {
            Text = selectedZ + " vs Amplitude vs Frequency"
        },
        Scene = new[]
                {
        new Scene()
        {
            XAxis = new Plotly.Blazor.LayoutLib.SceneLib.XAxis(){Title = new Plotly.Blazor.LayoutLib.SceneLib.XAxisLib.Title(){Text = "Frequency (Hz)"}},
            YAxis = new Plotly.Blazor.LayoutLib.SceneLib.YAxis(){Title = new Plotly.Blazor.LayoutLib.SceneLib.YAxisLib.Title(){Text = "Amplitude in (mV)"}},
            ZAxis = new Plotly.Blazor.LayoutLib.SceneLib.ZAxis(){Title = new Plotly.Blazor.LayoutLib.SceneLib.ZAxisLib.Title(){Text = "Amplidue out (" + selectedZ + ")"}}
        }
    },
        Margin = new Margin
        {
            L = 65,
            R = 50,
            B = 65,
            T = 90
        }
    };

config = new Config
    {
        Responsive = true
    };
}
private void Get3DplotData()    
{  
    
    z = new List<decimal[]>();        

    for(int i = 0; i < y.Count; i++)
    {
        var currentValues = new List<decimal>();
        
        currentValues = resultsService.GetResults(y[i]);
       
        z.Add(currentValues.ToArray());
    }
    
    data.Add(new Surface()
        {                        
            X = x.Cast<object>().ToList(),
            Y = y.Cast<object>().ToList(),
            Z = z.Cast<object>().ToList()                        
        });
    
}

Answer 1

通过在Replot方法中添加这三行代码来解决:

cht_dBVvsFvsA.Layout = layout3D_dBV;        
cht_dBVvsFvsA.Data = data;
cht_dBVvsFvsA.Update();