Fix error thrown when successfully submitting workout due to json->JSON and improve look of graphs

app.py

@@ -147,13 +147,21 @@ def workout(user_id, workout_id):
                 y_values = [reading.rpm for reading in cadence_readings]
                 fig, ax = plt.subplots()
                 ax.plot(x_values, y_values)
-                ax.set_xlabel('Time')
+                # ax.set_xlabel('Time')
                 ax.set_ylabel('Cadence (RPM)')
-                ax.set_title(
+
-                    'Cadence Readings for Workout {}'.format(workout_id))
+                # ax.set_title(
+                #    'Cadence Readings for Workout {}'.format(workout_id))
+                # Hide X and Y axes label marks
+                ax.xaxis.set_tick_params(labelbottom=False)
+                # ax.yaxis.set_tick_params(labelleft=False)
+                # Hide X and Y axes tick marks
+                ax.set_xticks([])
+                # ax.set_yticks([])
                 # Save the graph to a bytes buffer
                 buffer = io.BytesIO()
-                plt.savefig(buffer, format='png')
+                plt.savefig(buffer, format='png',
+                            transparent=True, bbox_inches='tight')
                 buffer.seek(0)
                 # Create a response object with the graph image
                 response = make_response(buffer.getvalue())

templates/attemptv2.html

@@ -48,6 +48,7 @@
                     <svg id="graph" class="bg-white shadow-md"></svg>
                 </div>
             </div>
+            <img src="http://127.0.0.1:5000/user/1/workout/2" alt="No image">
         </div>
     </div>
     <script>
@@ -115,7 +116,7 @@
                 },
                 body: JSON.stringify({ workout: workout }),
             }).then(res => res.json())
-                .then(res => swal("Submitted", json.stringify(res), "success"))
+                .then(res => swal("Submitted", JSON.stringify(res), "success"))
                 .catch(err => swal("Failed to submit workout", err.message, "error"));
 
             workout = [];
@@ -163,7 +164,7 @@
         const line = d3.line()
             .x((d) => xScale(d.x))
             .y((d) => yScale(d.y))
-            .curve(d3.curveCardinal);
+            .curve(d3.curveCardinal.tension(0.25));
 
         // Create an empty data array
         let data = [];