chart is a bit bigger now

This commit is contained in:
Dorian Zedler 2019-07-11 21:26:36 +02:00
parent cd9012bf69
commit 9b31d50629
2 changed files with 10 additions and 9 deletions

View file

@ -1,5 +1,5 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en" style="height: 100%">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
@ -17,7 +17,7 @@
</head> </head>
<body> <body style="height: 100%;">
<nav class="navbar navbar-dark fixed-top bg-dark flex-md-nowrap p-0 shadow"> <nav class="navbar navbar-dark fixed-top bg-dark flex-md-nowrap p-0 shadow">
<a class="navbar-brand col-sm-3 col-md-2 mr-0" href="#">BlueWeather</a> <a class="navbar-brand col-sm-3 col-md-2 mr-0" href="#">BlueWeather</a>
@ -28,8 +28,8 @@
</ul> </ul>
</nav> </nav>
<div class="container-fluid"> <div class="container-fluid" style="height: 100%">
<div class="row"> <div class="row" style="height: 100%">
<!-- Nav bar on the right side --> <!-- Nav bar on the right side -->
<nav class="col-md-2 d-none d-md-block bg-light sidebar"> <nav class="col-md-2 d-none d-md-block bg-light sidebar">
<div class="sidebar-sticky"> <div class="sidebar-sticky">
@ -95,7 +95,7 @@
</nav> </nav>
<!-- Main content area --> <!-- Main content area -->
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4"> <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4" style="height: 90%">
<div <div
class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom"> class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
<h1 class="h2" id="titleH1">Dashboard</h1> <h1 class="h2" id="titleH1">Dashboard</h1>
@ -104,7 +104,7 @@
<button type="button" class="btn btn-sm btn-outline-secondary">Share</button> <button type="button" class="btn btn-sm btn-outline-secondary">Share</button>
<button type="button" class="btn btn-sm btn-outline-secondary">Export</button> <button type="button" class="btn btn-sm btn-outline-secondary">Export</button>
</div> </div>
<div class="dropdown"> <div class="dropdown" class="h-100">
<button id="dropdownMenuButton" type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle" data-toggle="dropdown"> <button id="dropdownMenuButton" type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle" data-toggle="dropdown">
<span data-feather="calendar"></span> <span data-feather="calendar"></span>
This week This week
@ -118,7 +118,7 @@
</div> </div>
</div> </div>
<div id="mainContent"> <div id="mainContent" style="height: 100%">
</div> </div>
</div> </div>
</main> </main>

View file

@ -69,7 +69,7 @@ function setPage(page) {
chartData.data.push({ x: vals[i]["timestamp"], y: vals[i]["measvalue"] }) chartData.data.push({ x: vals[i]["timestamp"], y: vals[i]["measvalue"] })
} }
mainContent.innerHTML = "<canvas class=\"my-4 w-100\" id=\"myChart\" width=\"900\" height=\"380\"></canvas>" mainContent.innerHTML = "<canvas class=\"my-4 w-100\" id=\"myChart\"></canvas>"
setPageTitle(chartData.label) setPageTitle(chartData.label)
blueweather.log("creating chart with data: " + JSON.stringify(chartData), 3) blueweather.log("creating chart with data: " + JSON.stringify(chartData), 3)
@ -113,7 +113,8 @@ function createDiagram(canvasId, data) {
}; };
var chartOptions = { var chartOptions = {
responsive:true,
maintainAspectRatio: false,
scales: { scales: {
yAxes: [ yAxes: [
{ {