How do I add a Plotly figure factory annotated heatmap to a PDF without it looking blurry?

Question

Thank you in advance for all the help.

I am making a website with Python and Django and using Plotly and ReportLab to display heatmaps. The issue is I am struggling to have the graphs not look blurry when I add them to a PDF file.

Currently, the user can choose many heatmaps to be displayed. Once chosen they are then displayed on a webpage where the graphs look perfect. It isn't until the user downloads a PDF of all the graphs. It is in the PDF where the graphs look blurry.

I have tried to change the size and scale but have had no luck.

This is how I create the heatmap:

fig = ff.create_annotated_heatmap(
                        z,
                        annotation_text = well_numbers,
                        text = hover_info,
                        colorscale = colorscale,
                        font_colors = ['black',],
                        hoverinfo = 'text')

Here is how I convert the heatmap to an image in order to add them to a pdf file:

TrayLayoutView.graph_pdf_list.append(fig.to_image(format='png'))

Lastly, here is how to I make the pdf and add all the graph images to it (with ReportLab):

height = width = 700
x = 50
y = -30

# creates 'page' where to display the graph
page = canvas.Canvas(response, pagesize=landscape(letter))
page.setTitle(pdf_name)

# iterates all the graphs and adds them each one per page
for graph_image in TrayLayoutView.graph_pdf_list:
    image = ImageReader(io.BytesIO(graph_image)) 
    page.drawImage(image, x, y, width, height, preserveAspectRatio=True)
    page.showPage()

page.save()

Answer 1

This might be a bit late... but maybe try using something like weasyprint and render the graph a an svg like this:

svg = pio.to_image(fig, format="svg")
context["svg"] = svg.decode("utf-8")

See my fuller answer here