Skip to content

Creating a spectrum plot with callback #525

Closed

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

Activity

  1. gvwilson commented on Jul 17, 2024

    @gvwilson
    Contributor

    Hi - we are tidying up stale issues and PRs in Plotly's public repositories so that we can focus on things that are most important to our community. If this issue is still a concern, please add a comment letting us know what recent version of our software you've checked it with so that I can reopen it and add it to our backlog. (Please note that we will give priority to reports that include a short reproducible example.) If you'd like to submit a PR, we'd be happy to prioritize a review, and if it's a request for tech support, please post in our community forum. Thank you - @gvwilson

  2. added a commit that references this issue on Jul 23, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

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