Callback Functions

A fundamental concept

At the heart of building stunning web applications in Dash is the implementation of callback functions. Callback functions add life to our apps by enhancing user activity, in which we can generate plots or objects of any kind based on the user’s interactions with the app. In this lesson, we will explore what Dash callbacks are, how they enhance user interactivity, and how they are a core aspect that differentiates Dash from Plotly. We will also delve into the structure of a callback, the use of the @ decorator, and how to define the function for a callback.

A Dash callback is a Python function that gets executed automatically when the user interacts with certain components of a Dash application. These interactions, such as clicking a button or changing the value of a dropdown menu, trigger the callback function, which then updates the specified output Dash Components with new data or visuals.

While Plotly provides powerful tools for creating static and interactive plots, it lacks the ability to create fully interactive web applications that respond to user inputs. Dash, on the other hand, uses callbacks to establish a direct link between user actions and the application’s response. This enhances user interactivity and allows for the creation of sophisticated web applications that can update in real-time based on user inputs.

Structure of a callback

A Dash callback consists of two main parts: the @ decorator and the callback function. The @ decorator is used to define the relationship between the input and output Dash Components of the callback. It includes the @app.callback statement, followed by the Output and Input objects that specify the Dash Components to be updated and the Dash Components that trigger the callback, respectively.

Here’s an example of a callback structure: