waylon/flask-chartist-example
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(matplotlib) Added matplotlib page

Browse source
This commit is contained in:
Walker Waylon Scott 2017-05-21 10:48:38 -05:00
parent 129e98b383
commit 6bec8d8f25
5 changed files with 494 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

51
app/templates/home.html Normal file
View file

@ -0,0 +1,51 @@
<!DOCTYPE html>
<html>
<head>
{{ head_scripts | safe}}
<style>
body {margin:0;}
.topnav {
overflow: hidden;
background-color: #1F271B;
}
.topnav a {
float: left;
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
.topnav a:hover {
background-color: #ddd;
color: black;
}
.topnav a.active {
background-color: #D95D39;
color: white;
}
</style>
</head>
<body>
<div class="topnav">
<a class="active" href="#home">Home</a>
<a href="/home">Home</a>
<a href="/chartist">Chartist</a>
<a href="/matplotlib">Matplotlib</a>
</div>
{{ body | safe}}
</body>
<script>
{{ scripts | safe}}
</script>
</html>

21
app/templates/matplotlib.html Normal file
View file

@ -0,0 +1,21 @@
{% from "_render_field.html" import render_field %}
<h1>Population by Nation</h1><br>
data from
<a href="https://data.world/nrippner/population-by-country1980-2010">data.world</a>
<br><br>
Created with Flask and matplotlib
<span class='nation' value='nation'></span>
<fieldset>
<legend>World Population</legend>
{{ render_field(form.nation) }}
<img src="" name="population">
</div>

11
app/templates/matplotlib.js Normal file
View file

@ -0,0 +1,11 @@
function updateChartSrc(){
var nation = $("#nation option:selected").text()
var updatedData = $.get('/mpl/'.concat(nation));
updatedData.done(function(results){
$("img[name=population]").attr("src", results.src)
});
}
$("#nation").on('change', updateChartSrc);