adjusted graph to be svg
This commit is contained in:
36
app.py
36
app.py
@@ -1,4 +1,5 @@
|
|||||||
import requests
|
import requests, os
|
||||||
|
import plotly.graph_objects as go
|
||||||
from flask import Flask, render_template, jsonify, make_response
|
from flask import Flask, render_template, jsonify, make_response
|
||||||
from weasyprint import HTML
|
from weasyprint import HTML
|
||||||
|
|
||||||
@@ -6,15 +7,17 @@ app = Flask(__name__)
|
|||||||
|
|
||||||
@app.route('/report')
|
@app.route('/report')
|
||||||
def report():
|
def report():
|
||||||
# Prepare graph data
|
# Create Plotly graph
|
||||||
graph_data = [
|
fig = go.Figure(data=[go.Scatter(x=[1, 2, 3], y=[10, 20, 30], mode='lines')])
|
||||||
{
|
# Save the graph as an image
|
||||||
'x': [1, 2, 3],
|
image_path = os.path.join('static', 'graph.svg')
|
||||||
'y': [10, 20, 30],
|
|
||||||
'type': 'scatter'
|
fig.write_image(image_path)
|
||||||
}
|
return render_template('report.html', graph_image=image_path)
|
||||||
]
|
|
||||||
return render_template('report.html', graph_data=jsonify(graph_data))
|
@app.route('/')
|
||||||
|
def home():
|
||||||
|
return render_template('base.html')
|
||||||
|
|
||||||
def get_data():
|
def get_data():
|
||||||
response = requests.get('https://api.example.com/data')
|
response = requests.get('https://api.example.com/data')
|
||||||
@@ -22,8 +25,19 @@ def get_data():
|
|||||||
|
|
||||||
@app.route('/download-pdf')
|
@app.route('/download-pdf')
|
||||||
def download_pdf():
|
def download_pdf():
|
||||||
html = render_template('report.html')
|
# Create Plotly graph
|
||||||
|
fig = go.Figure(data=[go.Scatter(x=[1, 2, 3], y=[10, 20, 30], mode='lines')])
|
||||||
|
|
||||||
|
# Save the graph as an image
|
||||||
|
this_folder = os.path.dirname(os.path.abspath(__file__))
|
||||||
|
image_path = os.path.join(this_folder, 'static', 'graph.svg')
|
||||||
|
fig.write_image(image_path)
|
||||||
|
|
||||||
|
# Render the HTML template with the graph image
|
||||||
|
html = render_template('report.html', graph_image="file://" + image_path)
|
||||||
|
print(html)
|
||||||
pdf = HTML(string=html).write_pdf()
|
pdf = HTML(string=html).write_pdf()
|
||||||
|
|
||||||
response = make_response(pdf)
|
response = make_response(pdf)
|
||||||
response.headers['Content-Type'] = 'application/pdf'
|
response.headers['Content-Type'] = 'application/pdf'
|
||||||
response.headers['Content-Disposition'] = 'inline; filename=report.pdf'
|
response.headers['Content-Disposition'] = 'inline; filename=report.pdf'
|
||||||
|
|||||||
@@ -2,3 +2,4 @@ flask
|
|||||||
requests
|
requests
|
||||||
weasyprint
|
weasyprint
|
||||||
plotly
|
plotly
|
||||||
|
kaleido
|
||||||
36
static/css/styles.css
Normal file
36
static/css/styles.css
Normal file
@@ -0,0 +1,36 @@
|
|||||||
|
@page {
|
||||||
|
size: Letter;
|
||||||
|
margin: 1in;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: Arial, sans-serif;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
width: 100%;
|
||||||
|
border-collapse: collapse;
|
||||||
|
}
|
||||||
|
|
||||||
|
th, td {
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
padding: 8px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
th {
|
||||||
|
background-color: #f4f4f4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.graph-container {
|
||||||
|
width: 100%;
|
||||||
|
max-height: 400px;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-break {
|
||||||
|
page-break-before: always;
|
||||||
|
}
|
||||||
BIN
static/graph.png
Normal file
BIN
static/graph.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
1
static/graph.svg
Normal file
1
static/graph.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 6.2 KiB |
12
templates/base.html
Normal file
12
templates/base.html
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<title>Report</title>
|
||||||
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
{% block content %}{% endblock %}
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -1,9 +1,9 @@
|
|||||||
<div id="graph"></div>
|
{% extends "base.html" %}
|
||||||
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
|
{% block content %}
|
||||||
<script>
|
<h1>Report</h1>
|
||||||
const data = {{ graph_data | safe }};
|
<img src="{{ graph_image }}" alt="{{ graph_image }}">
|
||||||
Plotly.newPlot('graph', data);
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<table>
|
<table>
|
||||||
<thead>
|
<thead>
|
||||||
@@ -24,6 +24,7 @@
|
|||||||
|
|
||||||
<form method="POST" action="/submit">
|
<form method="POST" action="/submit">
|
||||||
<label for="data">Enter Data:</label>
|
<label for="data">Enter Data:</label>
|
||||||
<input type="text" id="data" name="data">
|
<input type="text" id="data" name="data" />
|
||||||
<button type="submit">Submit</button>
|
<button type="submit">Submit</button>
|
||||||
</form>
|
</form>
|
||||||
|
{% endblock %}
|
||||||
|
|||||||
Reference in New Issue
Block a user