diff --git a/static/javascript/statistics.js b/static/javascript/statistics.js
index 13606a7..811252a 100644
--- a/static/javascript/statistics.js
+++ b/static/javascript/statistics.js
@@ -1,160 +1,218 @@
 document.body.onload=loadStatistics()
 document.getElementById('statistics_nav').classList.add('active')
 
-async function loadStatistics(){
-
-    function create_boardgame_image_grid_rows(boardgames){
-      let rows_to_return = []
-
-      const row_container = document.createElement('div')
-      row_container.classList.add('container')
-      
-      const row = document.createElement('div')
-      row.classList.add('row')
-      row.classList.add('row-cols-1')
-      row.classList.add('row-cols-md-3')
-
-      for (let boardgame_index in boardgames){
-        let current_boardgame = boardgames[boardgame_index]
-
-        const column = document.createElement('div')
-        column.classList.add('col')
-
-        const boardgame_card = document.createElement('div')
-        boardgame_card.classList.add('card')
-        boardgame_card.classList.add('h-100')
-
-        const boardgame_imaged_linked = document.createElement('a')
-        boardgame_imaged_linked.setAttribute('href', '/boardgame?id=' + current_boardgame.id)
-
-        const boardgame_image = document.createElement('img')
-        boardgame_image.src = current_boardgame.thumbnail_url
-        boardgame_image.classList.add('card-img-top')
-        boardgame_image.classList.add('boardgame_statistic_card_image')
-
-        boardgame_imaged_linked.appendChild(boardgame_image)
-
-        const boardgame_card_body = document.createElement('div')
-        boardgame_card_body.classList.add('card-body')
-
-        const boardgame_title = document.createElement('h5')
-        boardgame_title.innerHTML = current_boardgame.name
-        boardgame_title.classList.add('card-title')
-
-        const boardgame_price_holder = document.createElement('p')
-        boardgame_price_holder.innerHTML = current_boardgame.price_paid
-        boardgame_price_holder.classList.add('card-text')
-
-        boardgame_card_body.appendChild(boardgame_title)
-        boardgame_card_body.appendChild(boardgame_price_holder)
-
-        boardgame_card.append(boardgame_imaged_linked)
-        boardgame_card.append(boardgame_card_body)
-
-        column.appendChild(boardgame_card)
-
-        row.appendChild(column)
-
-      }
-
-      return row
-
-    }
-
-    const gamesovertimechart = document.getElementById("gamesovertimechart")
+async function create_games_over_time_chart(){
+  const gamesovertimechart = document.getElementById("gamesovertimechart")
     
-    let games_over_time_statistic = await makeRequest(api_url + '/statistics/amount_of_games_over_time?day_step=30')
-    let games_over_time_statistic_no_expanions = await makeRequest(api_url + '/statistics/amount_of_games_over_time?day_step=30&filter_expansions_out=true')
-    let games_over_time_statistic_only_expanions = await makeRequest(api_url + '/statistics/amount_of_games_over_time?day_step=30&only_expansions=true')
+  let games_over_time_statistic = await makeRequest(api_url + '/statistics/amount_of_games_over_time?day_step=30')
+  let games_over_time_statistic_no_expanions = await makeRequest(api_url + '/statistics/amount_of_games_over_time?day_step=30&filter_expansions_out=true')
+  let games_over_time_statistic_only_expanions = await makeRequest(api_url + '/statistics/amount_of_games_over_time?day_step=30&only_expansions=true')
 
-    new Chart(gamesovertimechart, {
-        type: 'bar',
-        data: {
-          labels: Object.keys(games_over_time_statistic.result),
-          datasets: [{
-            label: games_over_time_statistic.name,
-            data: Object.values(games_over_time_statistic.result),
-            borderWidth: 1,
-            type: 'line'
-          },
-          {
-            label: "Base games",
-            data: Object.values(games_over_time_statistic_no_expanions.result),
-            borderWidth: 1
-          },
-          {
-            label: "Expansions",
-            data: Object.values(games_over_time_statistic_only_expanions.result),
-            borderWidth: 1
-          }
-        ]
-        },
-        options: {
-          scales: {
-            y: {
-              beginAtZero: true
-            }
-          }
-        }
-      });
-
-    $("#overtimechartname").text(games_over_time_statistic.name)
-
-
-    const gamesperyearchart = document.getElementById('gamesperyearchart')
-
-    let games_played_per_year_statistic = await makeRequest(api_url + '/statistics/games_played_per_year?filter_expansions_out=true')
-    
-    let years_played = []
-
-    for (date_index in Object.keys(games_played_per_year_statistic.result)){
-      const current_date = Object.keys(games_played_per_year_statistic.result)[date_index]
-      const year = current_date.substring(0, current_date.indexOf("-"));
-      years_played.push(year)
-    }
-
-    new Chart(gamesperyearchart, {
-      plugins: [ChartDataLabels],
+  new Chart(gamesovertimechart, {
       type: 'bar',
       data: {
-        labels: years_played    ,
+        labels: Object.keys(games_over_time_statistic.result),
         datasets: [{
-          label: games_played_per_year_statistic.name,
-          data: Object.values(games_played_per_year_statistic.result),
-          borderWidth: 1  
+          label: games_over_time_statistic.name,
+          data: Object.values(games_over_time_statistic.result),
+          borderWidth: 1,
+          type: 'line'
+        },
+        {
+          label: "Base games",
+          data: Object.values(games_over_time_statistic_no_expanions.result),
+          borderWidth: 1
+        },
+        {
+          label: "Expansions",
+          data: Object.values(games_over_time_statistic_only_expanions.result),
+          borderWidth: 1
         }
       ]
       },
       options: {
         scales: {
           y: {
-            beginAtZero: true,
-            max: Math.ceil((Math.max(...Object.values(games_played_per_year_statistic.result)))/ 250) * 250
-          }
-        },
-        plugins: {
-          datalabels: {
-              anchor: 'end',
-            align: 'end'
+            beginAtZero: true
           }
         }
       }
     });
-    $("#gamesperyearchartname").text(games_played_per_year_statistic.name)
+
+  $("#overtimechartname").text(games_over_time_statistic.name)
+}
+
+async function create_bar_chart(url, card_to_fill){
+  const chart_canvas = document.createElement('canvas')
+  chart_canvas.classList.add('chart_visual')
+  chart_canvas.classList.add('card-img-top')
+
+  let statistic_data = await makeRequest(url)
+
+  const highest_bar_value = Math.max(...Object.values(statistic_data.result))
+
+  let grid_offset = 0
+
+  if (highest_bar_value > 10000){
+    grid_offset = 25000
+  }else if(highest_bar_value > 1000){
+    grid_offset = 2500
+  }else if(highest_bar_value > 100){
+    grid_offset = 250
+  }else{
+    grid_offset = 25
+  }
+    
+  new Chart(chart_canvas, {
+    plugins: [ChartDataLabels],
+    type: 'bar',
+    data: {
+      labels: Object.keys(statistic_data.result),
+      datasets: [{
+        label: statistic_data.name,
+        data: Object.values(statistic_data.result),
+        borderWidth: 1  
+      }
+    ]
+    },
+    options: {
+      scales: {
+        y: {
+          beginAtZero: true,
+          max: Math.ceil((highest_bar_value) / grid_offset) * grid_offset
+        }
+      },
+      plugins: {
+        datalabels: {
+            anchor: 'end',
+          align: 'end'
+        }
+      }
+    }
+  });
+
+  const card_footer = document.createElement('div')
+  card_footer.classList.add('card-footer')
+  card_footer.classList.add('text-muted')
+  card_footer.innerHTML = statistic_data.name
+  
+  card_to_fill.appendChild(chart_canvas)
+  card_to_fill.appendChild(card_footer)
+
+}
+
+async function create_multiple_boardgame_chart(url, card_to_fill){
+  function create_boardgame_image_grid_row(boardgames){
+
+    const row_container = document.createElement('div')
+    row_container.classList.add('container')
+    
+    const row = document.createElement('div')
+    row.classList.add('row')
+    row.classList.add('row-cols-1')
+    row.classList.add('row-cols-md-3')
+
+    for (let boardgame_index in boardgames){
+      let current_boardgame = boardgames[boardgame_index]
+
+      const column = document.createElement('div')
+      column.classList.add('col')
+
+      const boardgame_card = document.createElement('div')
+      boardgame_card.classList.add('card')
+      boardgame_card.classList.add('h-100')
+
+      const boardgame_imaged_linked = document.createElement('a')
+      boardgame_imaged_linked.setAttribute('href', '/boardgame?id=' + current_boardgame.id)
+
+      const boardgame_image = document.createElement('img')
+      boardgame_image.src = current_boardgame.thumbnail_url
+      boardgame_image.classList.add('card-img-top')
+      boardgame_image.classList.add('boardgame_statistic_card_image')
+
+      boardgame_imaged_linked.appendChild(boardgame_image)
+
+      const boardgame_card_body = document.createElement('div')
+      boardgame_card_body.classList.add('card-body')
+
+      const boardgame_title = document.createElement('h5')
+      boardgame_title.innerHTML = current_boardgame.name
+      boardgame_title.classList.add('card-title')
+
+      const boardgame_price_holder = document.createElement('p')
+      boardgame_price_holder.innerHTML = current_boardgame.price_paid
+      boardgame_price_holder.classList.add('card-text')
+
+      boardgame_card_body.appendChild(boardgame_title)
+      boardgame_card_body.appendChild(boardgame_price_holder)
+
+      boardgame_card.append(boardgame_imaged_linked)
+      boardgame_card.append(boardgame_card_body)
+
+      column.appendChild(boardgame_card)
+
+      row.appendChild(column)
+
+    }
+
+    return row
+
+  }
+
+  statistic_data = await makeRequest(url)
+
+  const boardgame_image_container = document.createElement('div')
+  boardgame_image_container.classList.add('chart_visual')
+  boardgame_image_container.classList.add('container-fluid')
+
+  const row = create_boardgame_image_grid_row(statistic_data.result)
+
+  boardgame_image_container.appendChild(row)
+
+  card_to_fill.appendChild(boardgame_image_container)
+
+  const card_footer = document.createElement('div')
+  card_footer.classList.add('card-footer')
+  card_footer.classList.add('text-muted')
+  card_footer.innerHTML = statistic_data.name
+
+  card_to_fill.appendChild(card_footer)
+
+}
+
+function create_statistic_card_col(){
+  const col = document.createElement('col')
+  col.classList.add('col')
+
+  const card = document.createElement('div')
+  card.classList.add('card')
+  card.classList.add('h-100')
+
+  col.appendChild(card)
+
+  return col
+}
+
+async function loadStatistics(){
+
+  let statistic_row = document.getElementById('statistic_row')
+    
+  create_games_over_time_chart()
 
 
-    const mostexpensivegameschart = document.getElementById('mostexpensivegameschart')
+  const games_played_per_year_card_col = create_statistic_card_col()
+  const games_played_per_year_card = games_played_per_year_card_col.firstChild
+  statistic_row.appendChild(games_played_per_year_card_col)
+  const games_played_per_year_url = api_url + '/statistics/games_played_per_year?filter_expansions_out=true'
+  create_bar_chart(games_played_per_year_url, games_played_per_year_card)
 
-    let most_expensive_games_statistic = await makeRequest(api_url + '/statistics/most_expensive_games?top_amount=6')
+  const most_expensive_games_card_col = create_statistic_card_col()
+  const most_expensive_games_card = most_expensive_games_card_col.firstChild
+  statistic_row.appendChild(most_expensive_games_card_col)
+  const most_expensive_games_url = api_url + '/statistics/most_expensive_games?top_amount=6'
+  create_multiple_boardgame_chart(most_expensive_games_url, most_expensive_games_card)
 
-    const row = create_boardgame_image_grid_rows(most_expensive_games_statistic.result)
 
-    mostexpensivegameschart.appendChild(row)
-
-    // for (row_index in rows_to_fill_in){
-    //   mostexpensivegameschart.insertBefore(rows_to_fill_in[row_index], mostexpensivegameschart.firstChild)
-    // }
-
-    $('#mostexpensivegameschartname').text(most_expensive_games_statistic.name)
+   
 
 }
\ No newline at end of file
diff --git a/templates/statistics.jinja b/templates/statistics.jinja
index c1a42f1..0378328 100644
--- a/templates/statistics.jinja
+++ b/templates/statistics.jinja
@@ -4,7 +4,7 @@
 {% block body_block %} 
 
         <div class="container"> 
-                <div class="row row-cols-1 row-cols-md-2">
+                <div id="statistic_row" class="row row-cols-1 row-cols-md-2">
                         <div class="col">
                                 <div class="card h-100">
                                         <canvas class="chart_visual card-img-top" id="gamesovertimechart"></canvas>
@@ -12,20 +12,6 @@
                                         </div>
                                 </div>
                         </div>
-                        <div class="col">
-                                <div class="card h-100">                          
-                                        <canvas class="chart_visual card-img-top" id="gamesperyearchart"></canvas>
-                                        <div id="gamesperyearchartname" class="card-footer text-muted">
-                                        </div>
-                                </div>
-                        </div>
-                        <div class="col">
-                                <div class="card h-100">
-                                        <div class="chart_visual container-fluid" id="mostexpensivegameschart"></div>
-                                        <div id="mostexpensivegameschartname" class="card-footer text-muted">
-                                        </div>
-                                </div>
-                        </div>
                 </div>
         </div>