Using autogenerated HTML plots in PowerPoint

plotly.js
1

Hi,

I am currently using Plotly with Julia, and I want to use all the features offered by Plotly in PowerPoint (zoom, 3D views…).
So I convert my Plots in HTML script :

using PlotlyJS, CSV, HTTP, DataFrames
# Read data from a csv
df = CSV.File(
    HTTP.get("https://raw.githubusercontent.com/plotly/datasets/master/api_docs/mt_bruno_elevation.csv").body
) |> DataFrame
z_data = Matrix{Float64}(df)
layout = Layout(
    title="Mt Bruno Elevation",
    autosize=false,
    width=500,
    height=500,
    margin=attr(l=65, r=50, b=65, t=90)
)
figure = plot(surface(z=z_data), layout)
open("Figures/example.html", "w") do io
    PlotlyBase.to_html(io, figure.plot)
end

It seems to work fine, when I open the resulting file in a web browser, I have my graphic :). The problem is when I try to include the HTML file in my ppt, I found 2 ways to do it:

  • add an HTML file with an object of this method
  • use the LiveWeb add-on in combination with WampServer as a local host to publish my HTML file… this is not the easiest way but I can see the index page but the figures are not displayed ;(.

If anyone has any ideas on how to display the graphics in the PowerPoints, it would create nice slides :slight_smile:

François

2

Hello @FrancoisFEM,

Welcome to the community!

Are you saying that these ways do not work, or you are trying to find alternative ways to get the same?

3

Hello Jinnyzor,

Thanks for your answer :slight_smile:
Both methods don’t work ;( I’m open to other alternatives but would like to understand why my code doesn’t work.

François

4

How do you link to it on the PowerPoint?

5

Hello Jinnyzor,
Sorry, I didn’t see your answer earlier.
As I tried to explain, I found two ways to link my HTLM script to PowerPoint:

  • add an HTML file with an object of this method
  • use the LiveWeb add-on in combination with WampServer as a local host to publish my HTML file… this is not the easiest way but I can see the index page but the figures are not displayed ;(

everything is explained in the links :slight_smile:

6

I’m assuming that the javascript doesnt render when you are using it in this fashion, it is just a guess.

It seems like the LiveWeb has to be an actual webpage and not a file.

What do you see when you try to navigate to it?

7

Hi Jinnyzor,
That’s what I thought, that’s why I use WampServer. That way, everything happens as if I was browsing a classic web page. Here are some screenshots:
project in FireFox:
TestFireFox
result of a page generated by Julia in FireFox:

ExempleFireFox
ExempleFireFox594×578 35.4 KB

project in PowerPoint:
TestPPT
TestPPT1241×1068 41.6 KB

result of a page generated by Julia in PowerPoint:
ExemplePPT
ExemplePPT1155×1056 18.1 KB

from these results I think that there is a pb at the level of the generation of the HTML code in PlotLY but it is beyond my skills ;(

BR

8

Hello @FrancoisFEM,

It looks like the basics are working in the first power point picture.

I’m wondering if maybe things like Js and external stylesheets/scripts don’t want to load right.

What functionality are you missing specifically?

Would it be possible to create an image in the PowerPoint and actually hyperlink to the browser window and manipulate it from there?

9

Hello,
My first idea was also that the style elements and other JS files were a problem, however if we test with a Google page, Youtube or other it works properly … but I think that all style elements and other are used in these pages.
The solution to insert a static image and then create a link to the browser, is the solution I used for my last presentation but it forces to leave the presentation ;(.
I was hoping to find a solution that would allow me to present 3D images with the possibility of zooming and moving directly in the presentation :).

BR
François