# How to display PlotlyJS plots in browser (instead of Electron window)?

**URL:** https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451
**Category:** General Usage
**Tags:** plotting, visualization, plotlyjs
**Created:** [May 3, 2021, 8:25am UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451 "2021-05-03T08:25:59Z")
**Posts on this page:** 13
**Page:** 1

<div class="post-metadata">

### Author: ![RastislavMirek](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rastislavmirek/32/24683_2.png) [@RastislavMirek](https://discourse.julialang.org/u/RastislavMirek)
#### Post date: [May 3, 2021, 8:25am UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/1 "2021-05-03T08:25:59Z")

</div>

I am using PlotlyJS (directly, not as a backend to Plots), to display plots in Electron window (via Blink). I would like to display those plots in a browser instead. Obviously, it’s possible because Plots can do it when using Plotly as backend.

So how can I force PlotlyJS to use browser to display plots?  
Thank you

---

<div class="post-metadata">

### Author: ![RastislavMirek](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rastislavmirek/32/24683_2.png) [@RastislavMirek](https://discourse.julialang.org/u/RastislavMirek)
#### Post date: [May 4, 2021, 10:39pm UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/2 "2021-05-04T22:39:05Z")

</div>

No answers… Is this some non-standard thing??

---

<div class="post-metadata">

### Author: ![PetrKryslUCSD](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/petrkryslucsd/32/215825_2.png) [@PetrKryslUCSD](https://discourse.julialang.org/u/PetrKryslUCSD)
#### Post date: [May 5, 2021, 4:00am UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/3 "2021-05-05T04:00:15Z")

</div>

I am aware only of this piece of advice, directed in opposite direction: [GitHub - JuliaPlots/PlotlyJS.jl: Julia library for plotting with plotly.js](https://github.com/JuliaPlots/PlotlyJS.jl#installation)  
I tend to show the “send to cloud” button: [FinEtoolsFlexBeams.jl/VisUtilModule.jl at a1a843f850af58af1a1761852b659c17baa6807d · PetrKryslUCSD/FinEtoolsFlexBeams.jl · GitHub](https://github.com/PetrKryslUCSD/FinEtoolsFlexBeams.jl/blob/a1a843f850af58af1a1761852b659c17baa6807d/src/VisUtilModule.jl#L236)

---

<div class="post-metadata">

### Author: ![empet](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/empet/32/221303_2.png) [@empet](https://discourse.julialang.org/u/empet)
#### Post date: [May 5, 2021, 7:16pm UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/4 "2021-05-05T19:16:50Z")

</div>

No, it isn’t, as long as Plotly plots generated by plotlyjs, Python, and R can be displayed in Jupyter Notebook, and browser. At the moment PlotlyJS.jl plots are displayed in IJulia, but they do not persist after closing the notebook.

---

<div class="post-metadata">

### Author: ![RastislavMirek](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rastislavmirek/32/24683_2.png) [@RastislavMirek](https://discourse.julialang.org/u/RastislavMirek)
#### Post date: [May 5, 2021, 7:24pm UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/5 "2021-05-05T19:24:37Z")

</div>

But when you use PlotlyJS as backend to Julia’s Plots, it displays in browser. I only want to do the same with plan PlotlyJS… The question is how do I do it??

---

<div class="post-metadata">

### Author: ![empet](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/empet/32/221303_2.png) [@empet](https://discourse.julialang.org/u/empet)
#### Post date: [May 5, 2021, 7:39pm UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/6 "2021-05-05T19:39:28Z")

</div>

I know that for Plots.jl it is possible, but for the PlotlyJS no one tried to solve this.

---

<div class="post-metadata">

### Author: ![rikh](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rikh/32/204104_2.png) [@rikh](https://discourse.julialang.org/u/rikh)
#### Post date: [May 5, 2021, 7:58pm UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/7 "2021-05-05T19:58:16Z")

</div>

As a workaround, you could define something like

```julia
using PlotlyJS

function browser(p::Plot)
    tmp_filename = "plot.html"
    savefig(p, tmp_filename)
    run(`firefox $tmp_filename`)
end

```

and use it as follows

```julia
julia> p = Plot(scatter(; y=randn(3)))

julia> browser(p)

```

or via piping

```julia
julia> Plot(scatter(; y=randn(3))) |> browser

```

which should show your plot in the browser if I’m not mistaken. (Plotly doesn’t work on my system, so I didn’t test this code.)

---

<div class="post-metadata">

### Author: ![RastislavMirek](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rastislavmirek/32/24683_2.png) [@RastislavMirek](https://discourse.julialang.org/u/RastislavMirek)
#### Post date: [May 5, 2021, 8:03pm UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/8 "2021-05-05T20:03:43Z")

</div>

This seems to be good solution for me - with just one additional question: I am using `PlotlyJS.react!` to add data updates to the plot. How will that work (or not work?) with saving plot to file? If I update the wile will the browser pick up the changes automatically? Of is there a way to force refresh?

---

<div class="post-metadata">

### Author: ![RastislavMirek](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rastislavmirek/32/24683_2.png) [@RastislavMirek](https://discourse.julialang.org/u/RastislavMirek)
#### Post date: [May 5, 2021, 8:05pm UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/9 "2021-05-05T20:05:29Z")

</div>

Well, but if Plots can do it when using PlotlyJS as backend then anybody else must be able to do it right? Just do exactly the same thing that Plots are doing…

---

<div class="post-metadata">

### Author: ![rikh](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rikh/32/204104_2.png) [@rikh](https://discourse.julialang.org/u/rikh)
#### Post date: [May 5, 2021, 8:15pm UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/10 "2021-05-05T20:15:19Z")

</div>

> [@RastislavMirek](#):
>
> If I update the wile will the browser pick up the changes automatically? Of is there a way to force refresh?

[LiveServer.jl](https://github.com/tlienart/LiveServer.jl) can force browser refreshes for you. Basically, say that you’re working in a folder called `Foo` and you’re writing your file into that folder, so `Foo/plot.html`. Then, you can start a LiveServer in that folder which will keep track of all the files. You can then see your plot via `http://localhost:$port/plot.html` where `port` is the port used by LiveServer. This page will automatically refresh if the file `plot.html` changes.

If you also want to get rid of the work involved in re-generating the image. You could maybe use `Revise.entr`. This one just triggers if your package is updated. See the Revise documentation for details.

What is your use-case exactly, by the way? Are you creating a report or is viewing the plot in the browser just for development purposes?

---

<div class="post-metadata">

### Author: ![RastislavMirek](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rastislavmirek/32/24683_2.png) [@RastislavMirek](https://discourse.julialang.org/u/RastislavMirek)
#### Post date: [May 5, 2021, 10:11pm UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/11 "2021-05-05T22:11:44Z")

</div>

Thanks for the tip, this is truly valuable!

My use case: I am plotting progress of Flux models learning in real time, e.g. plotting training & validation set loss, epoch time etc. So yes, it is development visualisation. The plot updates after every epoch (usually 0.5-10 seconds).

I also need those WebIO callbacks to work because I am doing stuff like

```julia
    on(plt["relayout"]) do data
		println(data)
		if data isa Dict && haskey(data, "dragmode")
			plt.plot.layout.fields[:dragmode] = data["dragmode"]
		end
	end

```

The problems with Electron window are:

1. They die when particular learning Julia REPL is closed. No way I know of to prevent that. I need the training reports to be more durable as I use them to compare with previous model’s etc. performance.
2. It’s kind of impractical to switch between tens of those windows, while in browser they are nicely organised in tabs.
3. They get in the way every time I start new learning process, while browser just opens new tab.

---

<div class="post-metadata">

### Author: ![RastislavMirek](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rastislavmirek/32/24683_2.png) [@RastislavMirek](https://discourse.julialang.org/u/RastislavMirek)
#### Post date: [May 6, 2021, 1:58am UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/12 "2021-05-06T01:58:49Z")

</div>

Plus, the perhaps most important reason: It seems that the in-browser performance (when using Plotly as Plots backend) is much better than in Electron window. In Electron however, the GL versions of `scatter` (`scattergl`) seems to be much more responsive than in browser on my mac.

---

<div class="post-metadata">

### Author: ![ellocco](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/ellocco/32/31331_2.png) [@ellocco](https://discourse.julialang.org/u/ellocco)
#### Post date: [March 2, 2026, 3:08pm UTC](https://discourse.julialang.org/t/how-to-display-plotlyjs-plots-in-browser-instead-of-electron-window/60451/13 "2026-03-02T15:08:46Z")

</div>

Here the hack to do it in different OS:

```julia-auto
    if Sys.iswindows()
        run(`cmd /c start $temp_html_file`)
    elseif Sys.isapple()
        run(`open $temp_html_file`)
    elseif Sys.islinux()
        run(`xdg-open $temp_html_file`)
    end

```
