![](/img/trans.png)
[英]Multi-tab dash app : Placing `dcc.Store` component in different tabs
[英]Using complex numpy arrays with DCC.Store component (Dash/Python)
所以我正在使用相对较大的 arrays(尺寸(13、8192))到 plot 网站上的一些数字。 它已经像这样实施了,因此很难进行更改。
由于我使用浏览器的本地存储用完了 memory,我必须直接使用给定的复杂 NumPy 数组,然后在另一个回调中将其拆分为实部和虚部。 问题是我不能 JSON 序列化复杂的 arrays。 有人知道我可以做些什么来使用 Dash 的dcc.Store 组件“保存”这种数组吗? 提前致谢。
这是代码示例(它是一个非常简短的版本)。
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
import plotly.graph_objects as go
import numpy as np
app = dash.Dash(__name__)
T0 = 1E-12 # duration of input
N = 8192 #ammount of points
dt = 750*T0/N
T = np.arange(-N/2, N/2)*dt
m = 1
C = 0
def envelopef(T,T0,C,m):
U = (np.exp(-((1+1j*C)/2)*((T/T0)**(2*m)))).astype(complex)
UI = np.absolute(U)**2
return U, UI
z = np.arange(-10,10)
U, UI = envelopef(T,T0,C,m)
scatter1 = go.Scatter(x=T/T0,y=UI)
figure1 = go.Figure(data=[scatter1]).update_layout( )
env_graph = dcc.Graph(id='envelopesss',
animate=True,
figure=figure1.update_layout(width=600, height=600,
xaxis = dict(range = [-8, 8])))
M_slider = dcc.Slider(
id='m_slider',
min=1,
max=10,
step=1,
value=m,
marks={
1: {'label': '1'},
10: {'label': '10'}},
)
app.layout = html.Div([
M_slider,
dcc.Store(id='session', storage_type='local'),
dcc.Loading(id="loading1",children=[html.Div([env_graph]) ],type="circle",),
])
@app.callback(
Output("loading1", "children"),
Output("session", "data"),
[Input("m_slider", "value")])
def update_bar_chart(mn):
U, UI = envelopef(T,T0,C,mn)
phase = np.angle(U)
scatter1 = go.Scatter(x=T/T0,y=UI)
figure1 = go.Figure(data=[scatter1]).update_layout(width=600, height=600,
xaxis = dict(range = [-8, 8]))
data = {'u': U , 'ui':UI, 'up': phase}
env_graph = dcc.Graph(figure=figure1)
return env_graph, data
app.run_server(debug=True)
您可能想查看dash-extensions
中的ServersideOutput
组件。 它保留了数据服务器端(这应该会提高应用程序的性能),并且由于默认序列化程序是 pickle,因此复值 arrays 可以开箱即用。 您可以通过 pip 安装它,
pip install dash-extensions==0.0.66
要启用服务器端输出,请将应用初始化代码替换为
from dash_extensions.enrich import DashProxy, html, dcc, Input, Output, ServersideOutput, ServersideOutputTransform
app = DashProxy(__name__, transforms=[ServersideOutputTransform()])
接下来,将Output
替换为ServersideOutput
,
@app.callback(
Output("loading1", "children"),
ServersideOutput("session", "data"),
[Input("m_slider", "value")])
而已。 您的应用程序现在应该可以工作了。 为了完整起见,这里是完整的应用程序代码,
import plotly.graph_objects as go
import numpy as np
from dash_extensions.enrich import DashProxy, html, dcc, Input, Output, ServersideOutput, ServersideOutputTransform
app = DashProxy(__name__, transforms=[ServersideOutputTransform()])
T0 = 1E-12 # duration of input
N = 8192 # ammount of points
dt = 750 * T0 / N
T = np.arange(-N / 2, N / 2) * dt
m = 1
C = 0
def envelopef(T, T0, C, m):
U = (np.exp(-((1 + 1j * C) / 2) * ((T / T0) ** (2 * m)))).astype(complex)
UI = np.absolute(U) ** 2
return U, UI
z = np.arange(-10, 10)
U, UI = envelopef(T, T0, C, m)
scatter1 = go.Scatter(x=T / T0, y=UI)
figure1 = go.Figure(data=[scatter1]).update_layout()
env_graph = dcc.Graph(id='envelopesss',
animate=True,
figure=figure1.update_layout(width=600, height=600,
xaxis=dict(range=[-8, 8])))
M_slider = dcc.Slider(
id='m_slider',
min=1,
max=10,
step=1,
value=m,
marks={
1: {'label': '1'},
10: {'label': '10'}},
)
app.layout = html.Div([
M_slider,
dcc.Store(id='session', storage_type='local'),
dcc.Loading(id="loading1", children=[html.Div([env_graph])], type="circle", ),
])
@app.callback(
Output("loading1", "children"),
ServersideOutput("session", "data"),
[Input("m_slider", "value")])
def update_bar_chart(mn):
U, UI = envelopef(T, T0, C, mn)
phase = np.angle(U)
scatter1 = go.Scatter(x=T / T0, y=UI)
figure1 = go.Figure(data=[scatter1]).update_layout(width=600, height=600,
xaxis=dict(range=[-8, 8]))
data = {'u': U, 'ui': UI, 'up': phase}
env_graph = dcc.Graph(figure=figure1)
return env_graph, data
app.run_server(port=7777)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.