diff options
| author | Sean Dolan <sed9182@rit.edu> | 2019-07-28 20:04:16 +0000 |
|---|---|---|
| committer | Sean Dolan <sed9182@rit.edu> | 2019-07-28 20:04:16 +0000 |
| commit | f5adfb9c918d03704ca553b21e0ead8c195a5c36 (patch) | |
| tree | c23604bacf802ab70774f1ca345adc07bc14421c | |
| parent | f0e0f03b655609dbbd36cbc2577100a4bc8e51c3 (diff) | |
| parent | 062d1a4665ca3f4333bcfd5c55912f63c486bec9 (diff) | |
Merge branch 'sean-dev' into 'master'
bar chart
See merge request uncel_dolan/similar-beer!2
| -rw-r--r-- | templates/beerpage.jinja2 | 29 |
1 files changed, 29 insertions, 0 deletions
diff --git a/templates/beerpage.jinja2 b/templates/beerpage.jinja2 index 7c11dc8..d243578 100644 --- a/templates/beerpage.jinja2 +++ b/templates/beerpage.jinja2 @@ -1,5 +1,31 @@ {% extends "base.html" %} {% block content %} + <script> +window.onload = function () { + +//Better to construct options first and then pass it as a parameter +var options = { + title: { + text: "Column Chart in jQuery CanvasJS" + }, + data: [ + { + // Change type to "doughnut", "line", "splineArea", etc. + type: "column", + dataPoints: [ + { label: "apple", y: 10 }, + { label: "orange", y: 15 }, + { label: "banana", y: 25 }, + { label: "mango", y: 30 }, + { label: "grape", y: 28 } + ] + } + ] +}; + +$("#chartContainer").CanvasJSChart(options); +} +</script> <div id="title" class="text-center"> <h2>{{ beer_data.brewer if beer_data != None else 'DELICOUS BREWER' }}</h2> <h2>{{ beer_data.name if beer_data != None else 'DELICOUS BEER' }}</h2> @@ -18,6 +44,9 @@ </tr> </table> </div> + <div id="chartContainer" style="height: 370px; width: 100%;"></div> + <script type="text/javascript" src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script> + <script type="text/javascript" src="https://canvasjs.com/assets/script/jquery.canvasjs.min.js"></script> <h5>Beers like {{ beer_data.name }}</h5> <ul> {% for similar_beer in similar_beers %} |