Python은 Dash를 사용하여 웹 애플리케이션 개발

Python Dash로 웹 애플리케이션 개발을 위한 제어 기반

이 글에서는 주로 Dash의 Checklist 컴포넌트를 사용하여 Dash를 이용해 개발한 웹 애플리케이션을 간략하게 소개합니다

표시 효과는 다음과 같습니다.

Python의 간단한 기본 dash

Dash 애플리케이션은 두 부분으로 구성됩니다.

• 첫 번째 부분은 애플리케이션의 모양을 설명하는 애플리케이션의 레이아웃(Layout)입니다.
• 두 번째 부분에서는 애플리케이션의 상호작용성을 설명합니다.

1. 대시 레이아웃 레이아웃

대시 애플리케이션의 레이아웃은 애플리케이션의 외관을 설명합니다. 레이아웃은 구성 요소의 계층적 트리입니다.

Dash HTML 구성 요소(dash.html)는 모든 HTML 태그에 대한 클래스와 스타일, 클래스, ID와 같은 HTML 속성 키워드 매개변수 설명을 제공합니다.

Dash 핵심 구성 요소(dash .dcc)는 컨트롤 및 그래픽과 같은 고급 구성 요소를 생성합니다.

Dash 레이아웃에는 다음과 같은 여러 기능이 있습니다.

• 레이아웃은 구성 요소 트리로 구성됩니다.
• 복잡하고 재사용 가능한 구성 요소를 만듭니다.
• 핵심 구성 요소 모듈 dash .dcc에는 오픈 소스plotly.js JavaScript 그래픽 라이브러리를 사용하여 대화형 데이터 시각화를 제공하는 Graph라는 구성 요소가 포함되어 있습니다. Node.js는 35개 이상의 차트 유형을 지원하며 벡터 품질 SVG 및 고성능 WebGL을 사용하여 차트를 렌더링합니다. 자세한 내용은plotly.py 문서 및 갤러리를 참조하세요.
• 텍스트 블록을 작성하려면 dash.dcc의 Markdown 구성 요소를 사용할 수 있습니다.
• Dash 핵심 구성 요소(dash .dcc)에는 드롭다운 메뉴, 그래픽, 마커 블록 등과 같은 상위 수준 구성 요소 세트가 포함되어 있습니다.

1. Dash의 HTML 구성 요소

Dash는 HTML, CSS 및 JavaScript에 대한 순수한 Python 추상화를 제공하는 웹 애플리케이션 프레임워크입니다. HTML을 작성하거나 HTML 템플릿 엔진을 사용하는 대신 Python 및 Dash HTML 구성 요소 모듈을 사용하여 레이아웃을 구성하세요.

Dash HTML 구성 요소 모듈은 Dash의 일부이며 소스 코드는 https://github.com/plotly/dash에서 찾을 수 있습니다.

2. Dash의 핵심 구성 요소

Dash에는 대화형 사용자 인터페이스를 위한 동적 구성 요소가 탑재되어 있습니다.

Dash 핵심 구성 요소 모듈은 from dash import dcc를 통해 가져오고 사용할 수 있으며 드롭다운 메뉴, 체크리스트 및 슬라이더를 포함한 다양한 대화형 구성 요소에 액세스할 수 있습니다.

dcc 모듈은 Dash의 일부이며 소스 코드는 https://github.com/plotly/dash에서 찾을 수 있습니다.

2. Dash Core의 체크리스트

dcc.Checklist는 일련의 체크박스를 표시하는 데 사용되는 구성 요소입니다.

아래에서는 Checklist 컨트롤을 사용하여 Dash를 사용한 웹 애플리케이션 개발의 간단한 내용을 설명하기 위한 간단한 프로젝트를 설정했습니다.

Demo의 디렉토리 구조는 다음과 같습니다:

.
└── dash_demo
├── app.py
└── assets
├── favicon.ico
└── img
├── julia_50px_icon.png
├── python_50px_icon.png
└── r_50px_icon.png

앱의 내용. py는 다음과 같습니다:

from dash import Dash, html, dcc
app = Dash(__name__)
app.title = 'Dash控件教程'
app.layout = html.Div(children=[
dcc.Checklist(
options=['Python语言', 'Julia语言', 'R语言'],
value=['Python语言', 'R语言']
),
dcc.Checklist(
options=[
{'label': 'Python语言', 'value': '1'},
{'label': 'Julia语言', 'value': '2'},
{'label': 'R语言', 'value': '3'},
],
value=['1', '3']
),
dcc.Checklist(
options={
'1': 'Python语言',
'2': 'Julia语言',
'3': 'R语言',
},
value=['1', '3']
),
dcc.Checklist(
options=[
{
'label': html.Img(src=app.get_asset_url('img/python_50px_icon.png')),
'value': 'Python语言',
},
{
'label': html.Img(src=app.get_asset_url('img/julia_50px_icon.png')),
'value': 'Julia语言',
},
{
'label': html.Img(src=app.get_asset_url('img/r_50px_icon.png')),
'value': 'R语言',
},
],
value=['Python语言', 'R语言']
),
])

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

프로젝트 실행: python app.py.

브라우저 접속: http://127.0.0.1:8050.

대시 데모

간단한 설명:

• assets 디렉토리는 Dash 애플리케이션이 의존하는 정적 리소스 파일(예: 종속 css, js 및 favicon)을 저장하기 위해 공식적으로 권장되는 디렉토리입니다. .ico, 다양한 그림, 글꼴 및 기타 정적 리소스.
• Dash 컨트롤은 다양한 형태로 사용되며 매우 유연합니다. 예를 들어 기사의 체크리스트에서 옵션 라벨(사용자에게 표시됨)과 값(콜백에 전달됨)은 동일합니다. 사용하는 경우 값을 사용하는 콜백 로직을 변경하지 않고도 레이블을 쉽게 변경할 수 있도록 별도로 유지하는 것을 선호합니다.

위 내용은 Python은 Dash를 사용하여 웹 애플리케이션 개발의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!