[Feat] Enable dashboard code generation

[lingyielia]

Description

result = vizro_ai.dashboard([df1, df2], user_question_2_data, return_elements=True)
print(result.code)

Current version of output:

############ Imports ##############
import vizro.plotly.express as px
import vizro.tables as vt
import vizro.models as vm
from vizro.models.types import capture


####### Function definitions ######
@capture("graph")
def gapminder_scatter_plot(data_frame=None):
    df_copy = data_frame.copy() if data_frame is not None else pd.DataFrame()
    # Selecting relevant columns for the scatter plot
    scatter_df = df_copy[["lifeExp", "gdpPercap", "continent", "country"]]
    # Re-indexing the DataFrame if necessary
    scatter_df.reset_index(drop=True, inplace=True)

    # Create a scatter plot using Plotly Express
    fig = px.scatter(
        scatter_df,
        x="gdpPercap",
        y="lifeExp",
        color="continent",
        hover_name="country",
        title="Life Expectancy vs. GDP per Capita by Country",
        labels={"gdpPercap": "GDP per Capita", "lifeExp": "Life Expectancy"},
        template="plotly_white",
    )

    # Update layout for better aesthetics
    fig.update_layout(
        xaxis_title="GDP per Capita",
        yaxis_title="Life Expectancy",
        legend_title="Continent",
        showlegend=True,
    )

    return fig


####### Data Manager Settings #####
#######!!! UNCOMMENT BELOW !!!#####
# from vizro.managers import data_manager
# data_manager["266f87b0-fe3a-4056-9dc5-7dfaa06a421e"] = ===> Fill in here <===
# data_manager["tech_stock_data"] = ===> Fill in here <===


########### Model code ############
model = vm.Dashboard(
    pages=[
        vm.Page(
            components=[
                vm.AgGrid(
                    id="tech_stock_table",
                    figure=vt.dash_ag_grid(data_frame="tech_stock_data"),
                )
            ],
            title="Tech Stock Data",
            layout=vm.Layout(grid=[[0]]),
            controls=[],
        ),
        vm.Page(
            components=[
                vm.Card(
                    id="gapminder_card_1",
                    type="card",
                    text="The Gapminder dataset provides historical data on countries' development indicators.",
                    href="",
                ),
                vm.Graph(
                    id="gapminder_scatter_plot",
                    figure=gapminder_scatter_plot(
                        data_frame="266f87b0-fe3a-4056-9dc5-7dfaa06a421e"
                    ),
                ),
                vm.Card(
                    id="gapminder_card_2",
                    type="card",
                    text="Data spans from 1952 to 2007 across various countries.",
                    href="",
                ),
            ],
            title="Gapminder Data Visualization",
            layout=vm.Layout(grid=[[0, 1, 1], [2, 1, 1]]),
            controls=[
                vm.Filter(column="continent", targets=["gapminder_scatter_plot"]),
                vm.Filter(column="year", targets=["gapminder_scatter_plot"]),
            ],
        ),
    ],
    title="Tech and Gapminder Data Dashboard",
)

Screenshot

Notice

• I acknowledge and agree that, by checking this box and clicking "Submit Pull Request":

  • I submit this contribution under the Apache 2.0 license and represent that I am entitled to do so on behalf of myself, my employer, or relevant third parties, as applicable.
  • I certify that (a) this contribution is my original creation and / or (b) to the extent it is not my original creation, I am authorized to submit this contribution on behalf of the original creator(s) or their licensees.
  • I certify that the use of this contribution as authorized by the Apache 2.0 license does not violate the intellectual property rights of anyone else.
  • I have not referenced individuals, products or companies in any commits, directly or indirectly.
  • I have not added data or restricted code in any commits, directly or indirectly.

[maxschulz-COL]

LGTM, couple of comments

[antonymilne]

Generally looks good, just a few rough bits of implementation that could be improved 👍 So it's an approval because I know you don't want to wait too long on this.

Out of my suggestion I would maybe try to improve _process_to_set now and then leave create for another time, but up to you! Some of it is maybe not worth dedicating time to improve if it becomes redundant soon with the plot refactoring, so the comments are more just meant as useful feedback rather than changes that should necessarily be made.