CODEWITHSUNDEEP
javascriptpythonplotly-dash
rohith santosh
rohith santosh

Reputation: 40

how do I log the data on to a dash app using python

import dash_core_components as dcc
import dash_html_components as html
import dash
import sys

app = dash.Dash()

app.layout = html.Div([
    dcc.Interval(id='interval1', interval=1000,
n_intervals=0),
    dcc.Interval(id='interval2', interval=1 * 1000,
n_intervals=0),
    html.H1(id='div-out', children=''),
    html.Iframe(id='console-out',srcDoc='',style={'width':
'100%','height':400})
])

@app.callback(dash.dependencies.Output('div-out',
'children'),
    [dash.dependencies.Input('interval1', 'n_intervals')])
def update_interval(n):
    return 'hello'

@app.callback(dash.dependencies.Output('console-out',
'srcDoc'),
    [dash.dependencies.Input('interval2', 'n_intervals')])
def update_output(n):
    data = ''
    for i in range(n):
        data=data+'printing' + '<BR>'

    return data


app.run_server(debug=True)

I am using Dash for python as a standalone app I want to log the data on to (http://127.0.0.1:8050/logger). The above is the code that I tried by browsing. Is there a way where I can directly print the message onto the app so that I don't need to update the list every time? without using an iframe. Any help will be appreciated Thanks in advance.

Upvotes: 1

Views: 2381

Answers (1)

bas
bas

Reputation: 15462

You could do something like this:

import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State
import dash

app = dash.Dash(__name__)

printing = html.P(["printing", html.Br()])

app.layout = html.Div(
    [
        dcc.Interval(id="interval", interval=1000, n_intervals=0),
        html.Div(id="content"),
    ]
)


@app.callback(
    Output("content", "children"),
    Input("interval", "n_intervals"),
    State("content", "children"),
)
def update_output(interval, content):
    if not content:
        return [printing]

    return content + [printing]


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

So the idea of the code above is to create a container element that will hold the text elements. Then we can create a callback that is called every second using the Interval component. This callback uses the children property State of the container to take all the current children and add another element and return the result.

Be aware that this will keep adding elements to the DOM forever. So at a certain number of elements you might want to make it stop updating.

Upvotes: 3

Related Questions