order charts

Author: gebeto

index.html

@@ -76,39 +76,44 @@ <h1 style="text-align: center; margin: 40px 0px;">Telegram Charts</h1>
 
 		var chartsContainer = document.querySelector('#container');
 
-		fetch('assets/stage_2_data/1/overview.json').then(res => res.json()).then(chartData => {
-			chartData.x_on_zoom = (timestamp) => {
-				const response = fetch('assets/stage_2_data_extended/1/2018-04/07.json').then(res => res.json())
-				return response;
-			};
-			Graph.render(chartsContainer, chartData);
-		})
-
-		fetch('assets/stage_2_data/2/overview.json').then(res => res.json()).then(chartData => {
-			chartData.x_on_zoom = (timestamp) => {
-				const response = fetch('assets/stage_2_data_extended/2/2018-04/07.json').then(res => res.json())
-				return response;
-			};
-			Graph.render(chartsContainer, chartData);
-		})
-
-		fetch('assets/stage_2_data/3/overview.json').then(res => res.json()).then(chartData => {
-			chartData.x_on_zoom = (timestamp) => {
-				const response = fetch('assets/stage_2_data_extended/3/2018-04/07.json').then(res => res.json())
-				return response;
-			};
-			Graph.render(chartsContainer, chartData);
-		});
+		async function init() {
+			await fetch('assets/stage_2_data/1/overview.json').then(res => res.json()).then(chartData => {
+				chartData.x_on_zoom = (timestamp) => {
+					const response = fetch('assets/stage_2_data_extended/1/2018-04/07.json').then(res => res.json())
+					return response;
+				};
+				Graph.render(chartsContainer, chartData);
+			})
+	
+			await fetch('assets/stage_2_data/2/overview.json').then(res => res.json()).then(chartData => {
+				chartData.x_on_zoom = (timestamp) => {
+					const response = fetch('assets/stage_2_data_extended/2/2018-04/07.json').then(res => res.json())
+					return response;
+				};
+				Graph.render(chartsContainer, chartData);
+			})
+	
+			await fetch('assets/stage_2_data/3/overview.json').then(res => res.json()).then(chartData => {
+				chartData.x_on_zoom = (timestamp) => {
+					const response = fetch('assets/stage_2_data_extended/3/2018-04/07.json').then(res => res.json())
+					return response;
+				};
+				Graph.render(chartsContainer, chartData);
+			});
+	
+			await fetch('assets/stage_2_data/4/overview.json').then(res => res.json()).then(chartData => {
+				chartData.x_on_zoom = (timestamp) => {
+					const response = fetch('assets/stage_2_data_extended/4/2018-04/07.json').then(res => res.json())
+					return response;
+				};
+				Graph.render(chartsContainer, chartData);
+			});
+	
+			await fetch('assets/stage_2_data/5/overview.json').then(res => res.json()).then(chartData => Graph.render(chartsContainer, chartData))
+		}
 
-		fetch('assets/stage_2_data/4/overview.json').then(res => res.json()).then(chartData => {
-			chartData.x_on_zoom = (timestamp) => {
-				const response = fetch('assets/stage_2_data_extended/4/2018-04/07.json').then(res => res.json())
-				return response;
-			};
-			Graph.render(chartsContainer, chartData);
-		});
+		init();
 
-		fetch('assets/stage_2_data/5/overview.json').then(res => res.json()).then(chartData => Graph.render(chartsContainer, chartData))
 	</script>
 </body>
 </html>