我最近发现了plotly
,我认为这是在互联网上共享交互式地块的绝佳工具。由于我的研究是音频信号处理,因此我想用它将我的matlab / python图转换为交互式图,从而允许用户播放用于生成图的不同音频信号。
例如,如果一个条形图显示了一堆与许多不同的语音增强策略相对应的条形,那么我想找到一种在悬停在不同行上时播放不同音频信号的方法。
我发现this example(或here,可以使用codePen打开)将自定义悬停效果添加到plotly
图中;具体来说,该示例处理将鼠标悬停在图的条形上方时显示图像的问题。我想要类似的东西,但是触发音频播放而不是图像可视化。
如何对代码进行编辑? (例如,将鼠标悬停在其中一个小节上时播放given sound)
答案 0 :(得分:2)
我看到以下可用于此类可视化的方法:
import dash
import dash_audio_components
import dash_core_components
app = dash.Dash('app-name')
...Set serving locally because this component isn't placed to cdn
app.scripts.config.serve_locally = True
app.layout = html.Div(
children=[
dcc.Graph(
id='chart-id',
figure=<FigureObj>
),
dash_audio_components.DashAudioComponents(
id='audio-player',
url=None,
playStatus='STOPPED'
)
]
)
@app.callback(dash.dependencies.Output('audio-player', 'playStatus'),
[dash.dependencies.Input('chart-id', 'clickData')])
def set_status(click_data):
...Preserve somewhere status of audio-player and return changed state
...hover or unhover events can be handled as well
@app.callback(dash.dependencies.Output('audio-player', 'url'),
[dash.dependencies.Input('chart-id', 'clickData')])
def set_status(click_data):
...Return url from textual information received from click_data
本文介绍了共享某些状态的良好做法:Sharing data between callbacks