【数据科学系列】基于Python的Web应用框架Dash-Dash Bio Components快速入门

Dash Bio Components

Dash Bio是一套生物信息学组件,可以更简单地分析和可视化生物信息学数据,并在Dash应用程序中与它们进行交互。

快速入门

准备工作

pip install dash-bio==0.0.10

Molecule3dViewer

import json
import six.moves.urllib.request as urlreq

import dash
import dash_bio as dashbio
import dash_html_components as html


external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']

app = dash.Dash(__name__, external_stylesheets=external_stylesheets)

model_data = urlreq.urlopen('https://raw.githubusercontent.com/plotly/dash-bio-docs-files/master/mol3d/model_data.js').read()
styles_data = urlreq.urlopen('https://raw.githubusercontent.com/plotly/dash-bio-docs-files/master/mol3d/styles_data.js').read()
model_data = json.loads(model_data)
styles_data = json.loads(styles_data)

app.layout = html.Div([
    dashbio.Molecule3dViewer(
        id='my-dashbio-molecule3d',
        styles=styles_data,
        modelData=model_data
    ),
    "Selection data",
    html.Hr(),
    html.Div(id='molecule3d-output')
])


@app.callback(
    dash.dependencies.Output('molecule3d-output', 'children'),
    [dash.dependencies.Input('my-dashbio-molecule3d', 'selectedAtomIds')]
)
def show_selected_atoms(atom_ids):
    if atom_ids is None or len(atom_ids) == 0:
        return 'No atoms have been selected. Click somewhere on the molecular structure to select an atom.'
    return [html.Div([
        html.Div('Element: {}'.format(model_data['atoms'][atm]['element'])),
        html.Div('Chain: {}'.format(model_data['atoms'][atm]['chain'])),
        html.Div('Residue name: {}'.format(model_data['atoms'][atm]['residue_name'])),
        html.Br()
    ]) for atm in atom_ids]


if __name__ == '__main__':
    app.run_server(debug=True)

在这里插入图片描述


更多资料,请访问:https://dash.plot.ly/dash-bio

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Dash-UI 是一个基于 PythonWeb 应用框架,用于构建交互式的数据可视化应用程序。要使用 Dash-UI,你需要先安装相应的包。可以通过以下命令使用 pip 安装 Dash-UI: ``` pip install dash ``` 安装完成后,你可以创建一个 Python 文件,并导入 Dash 相关的库: ```python import dash import dash_core_components as dcc import dash_html_components as html from dash.dependencies import Input, Output ``` 接下来,你可以通过编写布局和回调函数来构建你的 Dash 应用。布局部分使用 HTML 和 CSS 标签,定义应用的外观和组件排列。回调函数部分用于定义组件之间的交互行为。 以下是一个简单的示例,展示了如何创建一个 Dash 应用: ```python app = dash.Dash(__name__) app.layout = html.Div( children=[ html.H1('欢迎使用 Dash-UI'), dcc.Input(id='input', value='', type='text'), html.Div(id='output') ] ) @app.callback( Output(component_id='output', component_property='children'), [Input(component_id='input', component_property='value')] ) def update_output_div(input_value): return f'你输入了:{input_value}' if __name__ == '__main__': app.run_server(debug=True) ``` 这个简单的应用包含一个输入框和一个输出区域,当你在输入框中输入内容时,输出区域会显示你输入的内容。 以上是 Dash-UI 的基本用法,你可以根据需求进一步探索和扩展。如果有具体的问题或需要更详细的帮助,请提供更多信息。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值