Multiple Plots এবং Data Widgets এর ইন্টিগ্রেশন Plotly তে একটি শক্তিশালী পদ্ধতি যা আপনাকে একটি ড্যাশবোর্ড বা ইন্টারেকটিভ ডেটা ভিজুয়ালাইজেশন তৈরি করতে সহায়তা করে। আপনি Multiple Plots (একাধিক গ্রাফ) এবং Data Widgets (যেমন ড্রপডাউন, স্লাইডার, টেক্সট ইনপুট, ইত্যাদি) ব্যবহার করে একটি ইন্টারেকটিভ ড্যাশবোর্ড তৈরি করতে পারেন, যেখানে ব্যবহারকারী গ্রাফের ডেটা বা ভিজুয়ালাইজেশন পরিবর্তন করতে পারে।
এখানে, আমরা দেখবো কীভাবে Multiple Plots এবং Data Widgets একসাথে ব্যবহার করা যায় এবং তাদের মধ্যে Dash ফ্রেমওয়ার্ক ব্যবহার করে ইন্টারেকটিভ সংযোগ স্থাপন করা যায়।
Multiple Plots তৈরি করা
Plotly তে একাধিক গ্রাফ (Multiple Plots) তৈরি করা এবং একে অপরের সাথে যুক্ত করা খুব সহজ। সাধারণত Subplots বা একাধিক Figures ব্যবহার করে এটি করা হয়। প্রতিটি প্লটের জন্য আলাদা ট্রেস (trace) বা ডেটা নির্ধারণ করা হয় এবং একসাথে একটি পৃষ্ঠায় প্রদর্শন করা হয়।
Multiple Plots উদাহরণ
import plotly.graph_objects as go
from plotly.subplots import make_subplots
# Subplot তৈরি করা
fig = make_subplots(rows=1, cols=2)
# প্রথম প্লটে Scatter Plot যোগ করা
fig.add_trace(go.Scatter(x=[1, 2, 3], y=[10, 11, 12], mode='markers', name='Scatter Plot'), row=1, col=1)
# দ্বিতীয় প্লটে Bar Plot যোগ করা
fig.add_trace(go.Bar(x=['A', 'B', 'C'], y=[10, 20, 30], name='Bar Plot'), row=1, col=2)
# গ্রাফ প্রদর্শন
fig.show()
এখানে:
make_subplotsব্যবহার করে আমরা একসাথে একাধিক গ্রাফ (Subplots) তৈরি করেছি। প্রথমে Scatter Plot এবং তারপর Bar Plot তৈরি করা হয়েছে।
Data Widgets Integration
Data Widgets হল বিভিন্ন ধরনের ইন্টারেকটিভ UI উপাদান, যেমন Dropdown, Slider, Radio Button, এবং Input Box, যা ব্যবহারকারীকে গ্রাফের সাথে ইন্টারঅ্যাক্ট করতে সহায়তা করে। Dash ফ্রেমওয়ার্কের মাধ্যমে এসব widgets কে Plotly গ্রাফের সাথে ইন্টিগ্রেট করা হয়।
Data Widgets উদাহরণ
এখানে একটি Dash অ্যাপ্লিকেশন তৈরি করা হচ্ছে যেখানে ড্রপডাউন এবং স্লাইডারের মাধ্যমে গ্রাফের ডেটা পরিবর্তন করা যাবে।
import dash
from dash import dcc, html
from dash.dependencies import Input, Output
import plotly.graph_objects as go
import pandas as pd
# Dash অ্যাপ্লিকেশন তৈরি করা
app = dash.Dash(__name__)
# উদাহরণ ডেটাসেট
df = pd.DataFrame({
'x': [1, 2, 3, 4, 5],
'y': [10, 11, 12, 13, 14],
'category': ['A', 'B', 'C', 'D', 'E']
})
# Layout তৈরি করা
app.layout = html.Div([
# ড্রপডাউন কম্পোনেন্ট
dcc.Dropdown(
id='category-dropdown',
options=[{'label': i, 'value': i} for i in df['category']],
value='A', # ডিফল্ট মান
),
# স্লাইডার কম্পোনেন্ট
dcc.Slider(
id='value-slider',
min=1,
max=10,
value=5,
marks={i: str(i) for i in range(1, 11)},
),
# গ্রাফ
dcc.Graph(id='line-graph'),
])
# Callback ফাংশন
@app.callback(
Output('line-graph', 'figure'),
[Input('category-dropdown', 'value'),
Input('value-slider', 'value')]
)
def update_graph(selected_category, slider_value):
# ডেটা ফিল্টার করা
filtered_df = df[df['category'] == selected_category]
# স্লাইডারের মান পরিবর্তনের উপর ভিত্তি করে গ্রাফ আপডেট করা
fig = go.Figure(
data=[go.Scatter(x=filtered_df['x'], y=filtered_df['y']*slider_value, mode='lines+markers')],
layout=go.Layout(title=f"Category: {selected_category} | Slider Value: {slider_value}")
)
return fig
# অ্যাপ চালানো
if __name__ == '__main__':
app.run_server(debug=True)
এখানে:
- Dropdown: ব্যবহারকারী একটি ক্যাটেগরি নির্বাচন করতে পারে, যা গ্রাফের তথ্য পরিবর্তন করবে।
- Slider: স্লাইডারের মাধ্যমে গ্রাফের Y-ভ্যালু পরিবর্তিত হবে।
- Callback:
@app.callbackএর মাধ্যমে ড্রপডাউন এবং স্লাইডারের ইনপুটের উপর ভিত্তি করে গ্রাফ আপডেট করা হয়।
Multiple Plots এবং Data Widgets এর Integration
Plotly এবং Dash ব্যবহার করে Multiple Plots এবং Data Widgets একত্রে ইন্টিগ্রেট করা হলে, আপনি একটি ড্যাশবোর্ডে একাধিক গ্রাফ এবং ইন্টারেকটিভ কন্ট্রোল তৈরি করতে পারেন। উদাহরণস্বরূপ, আমরা একাধিক গ্রাফ এবং বিভিন্ন widgets (যেমন ড্রপডাউন, স্লাইডার, এবং টেক্সট ইনপুট) যুক্ত করতে পারি।
উদাহরণ: Multiple Plots এবং Data Widgets এর Integration
import dash
from dash import dcc, html
from dash.dependencies import Input, Output
import plotly.graph_objects as go
import pandas as pd
# Dash অ্যাপ্লিকেশন তৈরি করা
app = dash.Dash(__name__)
# উদাহরণ ডেটাসেট
df = pd.DataFrame({
'x': [1, 2, 3, 4, 5],
'y1': [10, 11, 12, 13, 14],
'y2': [14, 13, 12, 11, 10],
'category': ['A', 'B', 'C', 'D', 'E']
})
# Layout তৈরি করা
app.layout = html.Div([
# ড্রপডাউন কম্পোনেন্ট
dcc.Dropdown(
id='category-dropdown',
options=[{'label': i, 'value': i} for i in df['category']],
value='A',
),
# স্লাইডার কম্পোনেন্ট
dcc.Slider(
id='value-slider',
min=1,
max=10,
value=5,
marks={i: str(i) for i in range(1, 11)},
),
# গ্রাফ
dcc.Graph(id='line-graph'),
dcc.Graph(id='bar-graph'),
])
# Callback ফাংশন
@app.callback(
[Output('line-graph', 'figure'),
Output('bar-graph', 'figure')],
[Input('category-dropdown', 'value'),
Input('value-slider', 'value')]
)
def update_graph(selected_category, slider_value):
# ডেটা ফিল্টার করা
filtered_df = df[df['category'] == selected_category]
# Line plot তৈরি
line_fig = go.Figure(
data=[go.Scatter(x=filtered_df['x'], y=filtered_df['y1']*slider_value, mode='lines+markers')],
layout=go.Layout(title=f"Line Graph: {selected_category} | Slider Value: {slider_value}")
)
# Bar plot তৈরি
bar_fig = go.Figure(
data=[go.Bar(x=filtered_df['x'], y=filtered_df['y2']*slider_value)],
layout=go.Layout(title=f"Bar Graph: {selected_category} | Slider Value: {slider_value}")
)
return line_fig, bar_fig
# অ্যাপ চালানো
if __name__ == '__main__':
app.run_server(debug=True)
এখানে:
- Multiple Plots: একসাথে দুইটি গ্রাফ (Line Plot এবং Bar Plot) প্রদর্শিত হচ্ছে, এবং দুটি গ্রাফই ড্রপডাউন এবং স্লাইডারের মাধ্যমে আপডেট হচ্ছে।
- Data Widgets: ড্রপডাউন এবং স্লাইডারের মাধ্যমে ব্যবহারকারী গ্রাফের উপস্থাপন পরিবর্তন করতে পারেন।
সারাংশ
Multiple Plots এবং Data Widgets এর ইন্টিগ্রেশন Plotly এবং Dash-এ আপনার ড্যাশবোর্ড বা ইন্টারেকটিভ ডেটা ভিজুয়ালাইজেশনকে আরও কার্যকরী এবং ব্যবহারকারী-বান্ধব করে তোলে। আপনি একাধিক গ্রাফ এবং বিভিন্ন UI উপাদান একসাথে ব্যবহার করে একটি ইন্টারেকটিভ ড্যাশবোর্ড তৈরি করতে পারেন, যা ব্যবহারকারীর ইনপুটের ভিত্তিতে ডেটার বিভিন্ন ভিজুয়াল রিপ্রেজেন্টেশন প্রদর্শন করে। Dash এর মাধ্যমে Callbacks ব্যবহার করে এই সকল উপাদানগুলির মধ্যে সংযোগ স্থাপন এবং আপডেট করা সম্ভব।
Read more
