diff --git a/server/scripts/modules/hourly-graph.mjs b/server/scripts/modules/hourly-graph.mjs
index 7c4a432..d9e8ba6 100644
--- a/server/scripts/modules/hourly-graph.mjs
+++ b/server/scripts/modules/hourly-graph.mjs
@@ -42,18 +42,20 @@ class HourlyGraph extends WeatherDisplay {
 	}
 
 	drawCanvas() {
-		if (!this.canvas) this.canvas = this.elem.querySelector('.chart canvas');
+		if (!this.image) this.image = this.elem.querySelector('.chart img');
 
 		// get available space
-		const boundingRect = this.canvas.getBoundingClientRect();
-		const availableWidth = boundingRect.width;
-		const availableHeight = boundingRect.height;
+		const availableWidth = 532;
+		const availableHeight = 285;
 
-		this.canvas.width = availableWidth;
-		this.canvas.height = availableHeight;
+		this.image.width = availableWidth;
+		this.image.height = availableHeight;
 
 		// get context
-		const ctx = this.canvas.getContext('2d');
+		const canvas = document.createElement('canvas');
+		canvas.width = availableWidth;
+		canvas.height = availableHeight;
+		const ctx = canvas.getContext('2d');
 		ctx.imageSmoothingEnabled = false;
 
 		// calculate time scale
@@ -97,6 +99,9 @@ class HourlyGraph extends WeatherDisplay {
 		this.elem.querySelector('.y-axis .l-2').innerHTML = midTemp;
 		this.elem.querySelector('.y-axis .l-3').innerHTML = minTemp;
 
+		// set the image source
+		this.image.src = canvas.toDataURL();
+
 		super.drawCanvas();
 		this.finishDraw();
 	}
diff --git a/server/scripts/modules/radar.mjs b/server/scripts/modules/radar.mjs
index bbb6e30..073c029 100644
--- a/server/scripts/modules/radar.mjs
+++ b/server/scripts/modules/radar.mjs
@@ -367,8 +367,6 @@ class Radar extends WeatherDisplay {
 		}
 
 		RadarContext.putImageData(RadarImageData, 0, 0);
-
-		// MapContext.drawImage(RadarContext.canvas, 0, 0);
 	}
 
 	static mergeDopplerRadarImage(mapContext, radarContext) {
diff --git a/server/styles/scss/_hourly-graph.scss b/server/styles/scss/_hourly-graph.scss
index 202bbbf..7e8cf29 100644
--- a/server/styles/scss/_hourly-graph.scss
+++ b/server/styles/scss/_hourly-graph.scss
@@ -89,7 +89,7 @@
 			top: 0px;
 			left: 50px;
 
-			canvas {
+			img {
 				width: 532px;
 				height: 285px;
 			}
diff --git a/views/partials/hourly-graph.ejs b/views/partials/hourly-graph.ejs
index dba3a73..2124782 100644
--- a/views/partials/hourly-graph.ejs
+++ b/views/partials/hourly-graph.ejs
@@ -11,7 +11,7 @@
 			<div class="label l-3">55</div>
 		</div>
 		<div class="chart">
-			<canvas id="chart-area"></canvas>
+			<img id="chart-area"></img>
 		</div>
 		<div class="x-axis">
 			<div class="label l-1">12a</div>
diff --git a/views/partials/radar.ejs b/views/partials/radar.ejs
index e77a13c..dbeeefb 100644
--- a/views/partials/radar.ejs
+++ b/views/partials/radar.ejs
@@ -1,43 +1,43 @@
 <div class="header">
-  <div class="logo"><img src="images/Logo3.png" /></div>
-  <div class="title dual">
-    <div class="top">
-      Local
-    </div>
-    <div class="bottom">
-      Radar
-    </div>
-  </div>
-  <div class="right">
-    <div class="precip">
-      <div class="precip-header">PRECIP</div>
-      <div class="scale">
-        <div class="text">Light</div>
-        <div class="scale-table">
-          <div class="box box-1"></div>
-          <div class="box box-2"></div>
-          <div class="box box-3"></div>
-          <div class="box box-4"></div>
-          <div class="box box-5"></div>
-          <div class="box box-6"></div>
-          <div class="box box-7"></div>
-          <div class="box box-7"></div>
-        </div>
-        <div class="text">Heavy</div>
-      </div>
-      <div class="time"></div>
-    </div>
-  </div>
+	<div class="logo"><img src="images/Logo3.png" /></div>
+	<div class="title dual">
+		<div class="top">
+			Local
+		</div>
+		<div class="bottom">
+			Radar
+		</div>
+	</div>
+	<div class="right">
+		<div class="precip">
+			<div class="precip-header">PRECIP</div>
+			<div class="scale">
+				<div class="text">Light</div>
+				<div class="scale-table">
+					<div class="box box-1"></div>
+					<div class="box box-2"></div>
+					<div class="box box-3"></div>
+					<div class="box box-4"></div>
+					<div class="box box-5"></div>
+					<div class="box box-6"></div>
+					<div class="box box-7"></div>
+					<div class="box box-7"></div>
+				</div>
+				<div class="text">Heavy</div>
+			</div>
+			<div class="time"></div>
+		</div>
+	</div>
 </div>
 
 <div class="main radar">
-  <div class="container">
-    <div class="scroll-area">
-      <div class="frame template">
-        <div class="map">
-          <img src="images/4000RadarMap2.jpg" />
-        </div>
-      </div>
-    </div>
-  </div>
+	<div class="container">
+		<div class="scroll-area">
+			<div class="frame template">
+				<div class="map">
+					<img src="images/4000RadarMap2.jpg" />
+				</div>
+			</div>
+		</div>
+	</div>
 </div>
\ No newline at end of file