- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试使用具有多个图表元素的交互式小部件作为发现 here并将其应用到 Dash 中,以便我可以进行多图表刷:
我在破折号中适本地显示了小部件,我可以使用套索进行选择,重新着色点,但不会更新桑基。我搜索并发现这可能是一个“回调”问题,但似乎没有一个解决这个特定问题。有人可以解释一下我缺少什么吗?
阴谋:
def chart1():
cars_df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/imports-85.csv')
# Build parcats dimensions
categorical_dimensions = ['body-style', 'drive-wheels', 'fuel-type'];
dimensions = [dict(values=cars_df[label], label=label) for label in categorical_dimensions]
# Build colorscale
color = np.zeros(len(cars_df), dtype='uint8')
colorscale = [[0, '#167b7e'], [1, '#4b3268']]
# Build figure as FigureWidget
fig = go.FigureWidget(
data=[
go.Scatter(x=cars_df.horsepower, y=cars_df['highway-mpg'],
marker={'color': 'gray'}, mode='markers', selected={'marker': {'color': 'firebrick'}},
unselected={'marker': {'opacity': 0.4}}),
go.Parcats(
domain={'y': [0, 0.4]}, dimensions=dimensions,
line={'colorscale': colorscale, 'cmin': 0,
'cmax': 1, 'color': color, 'shape': 'hspline'})
])
fig.update_layout(
height=800,
xaxis={'title': 'Horsepower'},
yaxis={'title': 'MPG', 'domain': [0.6, 1]},
dragmode='lasso',
hovermode='closest',
# plot_bgcolor='rgba(0, 0, 0, 0)',
paper_bgcolor='rgba(0, 0, 0, 0)',
autosize=False,
bargap=0.35,
font={"family": "Questrial", "size": 10})
# Update color callback
# @app.callback(Output("bigchart", "children"), [Input("points.point_inds", "value")]) <--- an attempt
def update_color(trace, points, state):
# Update scatter selection
fig.data[0].selectedpoints = points.point_inds
# Update parcats colors
new_color = np.zeros(len(cars_df), dtype='uint8')
new_color[points.point_inds] = 1
fig.data[1].line.color = new_color
# Register callback on scatter selection...
fig.data[0].on_selection(update_color)
# and parcats click
fig.data[1].on_click(update_color)
return fig
dcc.Graph(id="bigchart",figure=chart1())
最佳答案
如果您想在 Dash 中实现交互性,您应该将所有回调转换为 Dash 语法。这是您在 Dash 中的示例的一种可能实现,
import dash
import numpy as np
import pandas as pd
import plotly.graph_objects as go
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State
cars_df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/imports-85.csv')
# Build parcats dimensions
categorical_dimensions = ['body-style', 'drive-wheels', 'fuel-type']
dimensions = [dict(values=cars_df[label], label=label) for label in categorical_dimensions]
# Build colorscale.
color = np.zeros(len(cars_df), dtype='uint8')
colorscale = [[0, '#167b7e'], [1, '#4b3268']]
def build_figure():
fig = go.Figure(
data=[
go.Scatter(x=cars_df.horsepower, y=cars_df['highway-mpg'],
marker={'color': 'gray'}, mode='markers', selected={'marker': {'color': 'firebrick'}},
unselected={'marker': {'opacity': 0.4}}),
go.Parcats(
domain={'y': [0, 0.4]}, dimensions=dimensions,
line={'colorscale': colorscale, 'cmin': 0,
'cmax': 1, 'color': color, 'shape': 'hspline'})
])
fig.update_layout(
height=800,
xaxis={'title': 'Horsepower'},
yaxis={'title': 'MPG', 'domain': [0.6, 1]},
dragmode='lasso',
hovermode='closest',
# plot_bgcolor='rgba(0, 0, 0, 0)',
paper_bgcolor='rgba(0, 0, 0, 0)',
autosize=False,
bargap=0.35,
font={"family": "Questrial", "size": 10})
return fig
app = dash.Dash(prevent_initial_callbacks=True)
app.layout = html.Div([dcc.Graph(figure=build_figure(), id="graph")])
@app.callback(Output("graph", "figure"), [Input("graph", "selectedData"), Input("graph", "clickData")],
[State("graph", "figure")])
def update_color(selectedData, clickData, fig):
selection = None
# Update selection based on which event triggered the update.
trigger = dash.callback_context.triggered[0]["prop_id"]
if trigger == 'graph.clickData':
selection = [point["pointNumber"] for point in clickData["points"]]
if trigger == 'graph.selectedData':
selection = [point["pointIndex"] for point in selectedData["points"]]
# Update scatter selection
fig["data"][0]["selectedpoints"] = selection
# Update parcats colors
new_color = np.zeros(len(cars_df), dtype='uint8')
new_color[selection] = 1
fig["data"][1]["line"]["color"] = new_color
return fig
if __name__ == '__main__':
app.run_server()
关于plotly - 如何将 Dash 回调装饰器适本地应用于包含选择的 Plotly figurewidget,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62235672/
Mpeg 短跑流媒体 我正在写关于直播的论文。我使用带有 rtmp 模块的 ffmpeg,ngix 服务器和来自 Dash industry 的 dash.js .我通过 ffmpeg 开始流到服务器
我正在创建一个播放静态 mpeg-DASH 文件的应用程序。我一直在使用 MP4Box 创建 DASH .mp4 和 .mpd 文件。 MPD 文件包含单个 .mp4 文件中的字节范围偏移列表。这工作
当从任何一个下拉列表中选择任何选项时,我希望从所有其他下拉列表中删除相同的选项。 为了帮助形象化这一点,我正在尝试构建一个列映射器。对于左侧的每个列名,右侧都有一个下拉列表,用户可以在其中从他们上传的
我正在尝试为不同的信息集创建一个具有多个选项卡的应用程序。我的第一个想法是使用 html 按钮,但没有 dash_core_component 用于此,而且我找不到任何可以在其位置使用的文档。基本上,
请建议我如何在 dashing 应用程序中显示图像(在引用使用 dashing.io rubygem 创建的应用程序中) 最佳答案 使用图像小部件: 请注意,路径 /logo.png 指
我发现 Core Graphics 想要的字体名称与 UIFont 接受的不同。 例如,CG 接受“Helvetica Bold”但不接受“Helvetica-Bold”,而 UIFont 则相反。
我已将 dash 应用程序连接到 AWS RDS。我有一个实时更新的图表,它触发一个 n_interval 为 5 分钟的回调来查询数据库并进行一些昂贵的格式化。我将转换后的数据(约 500 个数据点
我对 Dash Plotly 很陌生,我正试图弄清楚如何设计这样的布局。 Layout : 据我了解,使用 dash bootstrap 组件可以更轻松地完成此操作。 https://dash-boo
我已经构建了一个仪表板并使用我自己的 css 自定义了外观。该应用程序的结构如下 然后我对我们的 linux 服务器进行了docker化和部署。不幸的是,我们的 linux 服务器用它自己的 css
戒指dash_daq.Gauge输出太薄,如下图所示。 我想要更厚的戒指。我在'inspect element'下找不到css元素来增加环的厚度。我该怎么做? 最佳答案 只需创建一个 assets 文
是否可以在图表底部有一个文本字段,以破折号显示它们所在点的文本(将悬停数据显示为纯文本)。因此,当用户将鼠标悬停在某个点上时,文本框将能够进行更改。我已经定义了一个 dcc.Graph 组件和应用程序
我正在尝试运行此 Dash 教程 https://github.com/cryptopotluck/alpha_vantage_tutorial/tree/master/dash_bootstrap/
作为 Dash 的初学者,我有一个简单的问题。我正在使用一个表来接受用户输入,读入它,最终对其执行一个操作,然后在第一个下面返回一个结果表。下面是我的代码: import dash import da
我正在尝试通过 macOS 上的 Jupiter notebook 运行 dash。它确实被导入,当我尝试运行 app.run_server 命令时它失败了。它给了我以下错误 [Errno 8] no
我遇到了 Plotly Dash 的问题,即由 dcc.Store 组件触发的回调每次触发两次。请参阅下面的代码和示例输出代码,它基于 Dash 文档 ( https://dash.plot.ly/d
我正在使用 dash 应用程序调用包含 351 列的大约 250,000 个值的大型数据集,以便我可以显示它。然而,它需要很长时间才能运行,我认为这是因为我从一个不同的应用程序调用数据,我用来收集名为
我正在更新一些代码以使用 Dash 和plotly。绘图的主要代码是在类中定义的。我用 Dash 控件替换了一些 Bokeh 小部件,最终得到了如下所示的回调: class MakeStuff:
我正在尝试实现用于播放受 widevine 保护的视频的 Android 应用程序。我在 Exoplayer 上构建我的应用程序,但我遇到了 MediaDrm 问题。 android.media.Me
你可以在这里看到实现: http://jsfiddle.net/Wtcdt/ 在 Mac 上的 FireFox 中,该圆圈是圆形/实心的。我想要它是虚线还是点线。 更奇怪的是,相同的属性(即 bord
我看GPUImage2的源码 picture = PictureInput(image:UIImage(named:"WID-small.jpg")!) filter = Satura
我是一名优秀的程序员,十分优秀!