Plotly Graph Shows Up Blank In A Html Page

I'm attempting to embed a graph into a HTML page using Python Plotly and Pandas, in Linux. I found this answer from user @Fermin Silva, which suggests using plotly.offline.plot to

Solution 1:

Use Graph Objects.

import pandas as pd
import numpy as np
import chart_studio.plotly as py
import cufflinks as cf
import seaborn as sns
import plotly.express as px

import plotly.graph_objects as go

scoresByTeamId = {1: [100, 110, 115, 95, 112, 120, 110, 99], 2: [115, 99, 75, 111, 120, 77, 80, 110], 3: [100, 105, 102, 115, 99, 99, 100, 134]}
teamNamesByTeamId = {1: "John", 2: "Pete", 3: "Edgar"}
df_scores = pd.DataFrame(data=scoresByTeamId)

fig = go.Figure()

for team in scoresByTeamId:
    fig.add_trace(go.Scatter(x=[1,2,3,4,5,6,7,8],
                            y=scoresByTeamId[team],
                            name=teamNamesByTeamId[team],
                            mode="lines+markers"))

fig.update_layout(
    xaxis=dict(title="Week",
                tickvals=[1,2,3,4,5,6,7,8]),
    yaxis=dict(title="Points Scored"),
    title="PPG by Week"
)

fig.show() # this is just to see it in browser in case you want to, it isn't necessary.
html = fig.to_html(full_html=True, include_plotlyjs=True)
print(html)

# save html file
filePath="C:\\myFilePath\\myHtmlFile.html"
with open(filePath, "w") as f:
    f.write(html)