Style() not defined

[otobrzo]

I have upgraded PlotlyJS to version 0.18.3 (from 0.14) and Style(), use_style!() commands are no more defined.

[sglyon]

That is right -- we have removed Style in favor of the officially supported layout.template system.

I am happy to provide support in helping you transition to the new template system. Could you please provide some code examples that you were using before and I can show you the way to do things going forward?

Thanks and sorry for breaking change

[otobrzo]

Thank you for fast response.

I have function:

function set_plotly_style()

    return fig_style = let
        axis = attr(showgrid=true, gridcolor="#e9e9e9", linewidth=1.5,
                linecolor="#555555", 
                titlefont_color="#555555",
                titlefont_size=16, ticks="outside",
                tickcolor="#555555", zeroline=false
                )
        layout = Layout(plot_bgcolor="#ffffff",
                    paper_bgcolor="white", 
                    font=attr(family="Arial"),                
                    font_size=14,
                    xaxis=axis,
                    yaxis=axis,
                    titlefont_size=14,
                    yaxis_title_standoff=1, yaxis_automargin=true,
                    legend=attr(font_size=12, bgcolor="white", 
                                bordercolor="#555555", borderwidth=1))
        Style(layout=layout)

    end
end

and then I just use

fig_style = set_plotly_style()
use_style!(fig_style) 

[empet]

@sglyon plotly.py allows for custom style. I defined my own style file, plotlyju.jl, used for the 3D charts defined in this repo: https://github.com/empet/3D-Viz-with-PlotlyJS.jl, because I don't like to have title_text aligned at left, like in plotly template. Also my colorbar_thickness is 25, and more. It would have been nice to leave the possibility for user defined style, too.

[sglyon]

Thanks @otobrzo and @empet

All the functionality that Styles used to provide is still available to us using templates. The benefit is that we integrate with the other plotly libraries and leave the implementation of applying styles to plotly.js itself instead of having to do it here

@otobrzo example above can now be written:

function set_plotly_template()
    axis = attr(
        showgrid=true, gridcolor="#e9e9e9", linewidth=1.5,
        linecolor="#555555",
        titlefont_color="#555555",
        titlefont_size=16, ticks="outside",
        tickcolor="#555555", zeroline=false
    )
    layout = Layout(
        plot_bgcolor="#ffffff",
        paper_bgcolor="white",
        font_family="Arial",
        font_size=14,
        xaxis=axis,
        yaxis=axis,
        titlefont_size=14,
        yaxis_title_standoff=1, yaxis_automargin=true,
        legend=attr(
            font_size=12, bgcolor="white",
            bordercolor="#555555", borderwidth=1
        )
    )

    # CHANGE: create a `Template` instead of a `Style`
    Template(layout=layout)
end

fig_template = set_plotly_template()

# CHANGE: add the template under the "personal" key
templates.personal = fig_template

# CHANGE: set the default template to the "personal" template -- must match key from previous step
templates.default = "personal"

[sglyon]

I'm going to close here now, but if you find examples that are not working please let me know and we'll work on them together

[otobrzo]

Thank you for the update. I have one use case.
In subplot the style has to be set after plotting

pp = plot_subplots()
pp.style = mystyle

[sglyon]

Sorry i don’t think I followed. Was the most recent post another question?

[otobrzo]

I just wanted to clarify the style transfer to subplots:

http://juliaplots.org/PlotlyJS.jl/stable/styles/

says in a note:

Styles do not transfer to parent plots when creating subplots. If you want to apply a Style to a plot containing subplots you must either use the global mode or construct the plot and set the style field on the parent after subplots are created (e.g. p = [p1 p2]; p.style=ggplot, where ggplot is defined as above)

However, It seems to me template approach is transferred to a subplot, so everything is fine.

Thank you

[DSilva27]

Hi @sglyon could please help me adapt this code to be used with Templates?

nlaStyle = let
    axis = attr(showgrid=true, gridcolor="#E5E5E5",
        linewidth=1.0,
        titlefont_color="#555555", titlefont_size=18,
        linecolor="black", mirror=true, zeroline=false,
        ticks="inside")
    layout = Layout(font_size=16, xaxis=axis, yaxis=axis,
        titlefont_size=18, width=500, height=300)

    colors = Cycler([
            "#E24A33", "#348ABD", "#988ED5", "#777777",
            "#FBC15E", "#8EBA42", "#FFB5B8"
    ])
    gta = attr(
        marker_line_width=0.5, marker_line_color="#348ABD",
        marker_color=colors, marker_size=10
    )
    Style(layout=layout, global_trace=gta)
end

This is what I have so far

function set_plotly_template()
    axis = attr(showgrid=true, gridcolor="#E5E5E5",
        linewidth=1.0,
        titlefont_color="#555555", titlefont_size=18,
        linecolor="black", mirror=true, zeroline=false,
        ticks="inside")

    colors = Cycler([
            "#E24A33", "#348ABD", "#988ED5", "#777777",
            "#FBC15E", "#8EBA42", "#FFB5B8"
    ])
    gta = attr(
        marker_line_width=0.5, marker_line_color="#348ABD",
        marker_color=colors, marker_size=10
    )

    layout = Layout(font_size=16, xaxis=axis, yaxis=axis,
    titlefont_size=18, width=500, height=300)

    # CHANGE: create a `Template` instead of a `Style`
    Template(layout=layout)
end

Where do I put the global trace? Also, is there any documentation on how to use Templates for Julia? The official docs still tell you to use Styles.

Thank you

[empet]

This is the template with your settings:

using PlotlyJS

function dsilva_template()
    axis = attr(showgrid=true, gridcolor="#E5E5E5",
        linewidth=1.0,
        title_font_color="#555555", title_font_size=14,
        linecolor="black", showline=true, mirror=true, zeroline=false,
        ticks="inside")
    layout=Layout(font_size=16, xaxis=axis, yaxis=axis,
        titlefont_size=18, width=500, height=300)

    layout[:colorway]=[
            "#E24A33", "#348ABD", "#988ED5", "#777777",
            "#FBC15E", "#8EBA42", "#FFB5B8"]
    
    t = Template(layout=layout)
    t.data[:scatter]  = [attr(marker_line_width=0.5,
                              marker_line_color="#348ABD",
                              marker_size=10)]
    return t
end

templates.personal = dsilva_template()
templates.default = "personal";

Checked it on the following plots:

fig1 = Plot(scatter(x=rand(1:8), y=rand(8), mode="markers"), Layout(width=600, height=300,
        title_text="My test", xaxis_title="x", yaxis_title="y"))

addtraces!(fig1,  scatter(x=1:8, y=rand(8), mode="markers"))
display(fig1)

and:

function pyramid(; n=256)
    s    = range(-1.0, 1.0, length=n)
    x, y = [sx for sy in s, sx in s], [sy for sy in s,  sx in s]
    return  1 .- [maximum([a, b]) for  (a,b) in zip(abs.(x), abs.(y))]
end; 

fig2= Plot(heatmap(z=pyramid(;), colorscale=colors.viridis), Layout(title_text="Heatmap", width=500, height=450))

[jclsn]

This was two years ago and the deprecated Styles are still in the documentation. This changed isn't mentioned anywhere.

http://juliaplots.org/PlotlyJS.jl/stable/styles/#Using-Styles