How does the Print PDF button works in vanguard report?

Dash Python
1

I am making a dashboard app and I want to add the Print PDF button just like https://vanguard-report.herokuapp.com/ report, can anyone please explain its working ?

Printable to PDF App - Proper way of doing it?
2

If you look at the source code at

https://github.com/plotly/dash-vanguard-report/blob/master/app.py

you will find links to various external resources including

https://codepen.io/bcd/pen/YaXojL.js
https://codepen.io/bcd/pen/KQrXdb.css

The JavaScript file calls window.print() when the button is clicked, and the css file sets up the print layout in @media print.

2 Likes
3

This example code is not available anymore :frowning:

1 Like
4

You can print pdf like this:

  1. install this package python -m pip install visdcc
  2. import visdcc
  3. Add these lines in the layout

html.Div([
html.Button(“Download”, id=“click1”),
visdcc.Run_js(id = ‘javascript’)
])

  1. add callback

@app.callback(
Output(‘javascript’, ‘run’),
[Input(‘click1’, ‘n_clicks’)])

def myfun(x):
if x:
return “window.print()”
return “”

  1. save it, run the code and click download button. It will work 100%
    6.Thanks