Dash canvas roadmap

[iuliancioarca]

Are there any plans to bring Dash canvas to Julia? It would be cool to be able to draw and annotate.

[alexcjohnson]

As our doc page for canvas says:

Note: dash-canvas is a legacy package, the recommended way to annotate images is to use the drawing tools of plotly figures.

Are there features of canvas you can't replicate this way? We'd prefer to improve the new feature than continue to propagate the old one.

[iuliancioarca]

Thank you for pointing this out. I tried to follow the docs and got stuck:
dcc_graph(id="graph1",style=(width="99%",height="595px",), config = (modeBarButtonsToAdd= ["drawline", "drawopenpath", "drawclosedpath", "drawcircle", "drawrect", "eraseshape",],))

Invalid argument configpassed into Graph with ID "graph1". Expectedobject. Was supplied type array.

Can you share an example of how to configure the dcc_graph, please?

[alexcjohnson]

@mohamed82008 @efmanu can one of you comment on this? Perhaps a good test case for converting the Python docs to Julia 😄

[mohamed82008]

@efmanu please add an example on this.

[efmanu]

@iuliancioarca

config and style should be a dictionary.

You can try something like the below to plot a graph with Dash.

using Dash, DashCoreComponents, PlotlyJS, DataFrames

df_wide = DataFrame(
    year=1995:2012,
    world=[219, 146, 112, 127, 124, 180, 236, 207, 236, 263, 350, 430, 474, 526, 488, 537, 500, 439],
    china=[16, 13, 10, 11, 28, 37, 43, 55, 56, 88, 105, 156, 270, 299, 340, 403, 549, 499],
)

df = DataFrames.stack(df_wide, Not(:year), variable_name=:country, value_name=:y)
fig = plot(
    df, x=:year, y=:y, color=:country,
    Layout(
        title_text="US Export of Plastic Scrap",
        legend=attr(x=0, y=1)
    )
)

app = dash()
app.layout = dcc_graph(
    figure=fig, style=Dict("width"=>"99%","height"=>"595px",), id="graph1",
    config = Dict(
        "modeBarButtonsToAdd" => [
            "drawline", "drawopenpath", "drawclosedpath", "drawcircle", "drawrect", "eraseshape",
            ],
        )
)
run_server(app, "0.0.0.0", debug=true)

[iuliancioarca]

Thank you all very much for your support! I really appreciate it!

[iuliancioarca]

One last question. Is it possible to modify the "grid" somehow so that I can join lines? At the moment whenever I come too close to another stroke the shape selection crosshair appears and I cannot start my new line from the end of another. I can move them after zooming in, but it's a bit cumbersome.

[tolgahancepel]

Hey @iuliancioarca, I was working on object detection and plotting bounding boxes with PlotlyJS. This code may help you to create an image annotation app for object detection, or future steps. Here:
https://colab.research.google.com/drive/1INsaqUZa-zzTGNZzD54fnW1qRJBPFt2i?usp=sharing

P.S. Try downloading and running the notebook on local, Colab has some issues.