Skip to content

Creating a spectrum plot with callback #525

Description

@yaronogen

Hello all,
I have a csv file with 15 soil samples. each sample has some parameters like: OM and Clay and in addition it has a spectrum (starting from 400 until 750).
Im trying to create a dashboard with 3 sections:

  1. Plot of Clay vs. Sand
  2. stats data
  3. spectrum graph from 400 until 750.

and i would like the stats data and the spectrum graph to be updated automatically when i hover over a certain point in the first plot.
I was able to do so with the stats data, however, I was not able to do it with the spectrum.
I dont know if i was reading the data correctly or I had a problem with the callback.

Im new to python and dash so I would need your assistance
Thank you

import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly
import plotly.plotly as py
import plotly.graph_objs as go
import plotly.offline as pyo
import pandas as pd
import cufflinks as cf
from dash.dependencies import Input, Output

app = dash.Dash()

df = pd.read_csv('test_GitHub.csv', index_col=None, na_values=['NA'],sep=',',low_memory=False)

app.layout = html.Div([ #global title
html.Div([ #header
html.H1('Title'),
html.H3('Additional title')
]),
html.Div([
dcc.Graph(
id = 'test_scatter',
figure = {
'data': [go.Scatter(
x = df['Clay'],
y = df['Sand'],
text = df['Soil'],
hoverinfo = ['text','x','y'],
mode = 'markers'
)],
'layout': go.Layout(
title = 'Plot',
xaxis = {'title': 'Clay'},
yaxis = {'title': 'Sand'},
hovermode = 'closest'
)}),
dcc.Markdown(
id = 'stats',
),
dcc.Graph(
id = 'spec',
figure = {
'data': [go.Scatter(
x = df['400':'750'],
y = df.iloc[soil_index]['400':'750'],
text = df['Soil'],
hoverinfo = ['text','x','y'],
mode = 'markers'
)],
'layout': go.Layout(
title = 'Spectrum',
xaxis = {'title': 'Wavelength (nm)'},
yaxis = {'title': 'Value'},
hovermode = 'closest'
)})
],style = {'width': '50%', 'height': '50%', 'display': 'inline-block'})])

@app.callback(
Output('stats', 'children'),
[Input('test_scatter','hoverData')])

def callback_stats(hoverData):
soil_index = hoverData['points'][0]['pointIndex']
stats = """
The soil is located in Latitude {} and Longitude {} and contains:

    {}(%) Organic Matter
    {}(% wt.) Clay
    {}(% wt.) Silt
    {}(% wt.) Sand
    """.format(df.iloc[soil_index]['OM'],
                df.iloc[soil_index]['Clay'],
                df.iloc[soil_index]['Silt'],
                df.iloc[soil_index]['Sand'])
return stats

@app.callback(
Output('spec', 'children'),
[Input('test_scatter','hoverData')])

def callback_spec(hoverData):
soil_index = hoverData['points'][0]['pointIndex']

return stats

if name == 'main':
app.run_server()

test_GitHub.txt

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions