Change graph sizing before beginning UI configuration

Author: Umius-Brian

Chronos Slide Deck Notes.rtf

@@ -31,8 +31,8 @@ const LatencyChart = (props) =>  {
           },
         }]}
         layout = {{
-          width: 500,
-          height: 500,
+          width: 400,
+          height: 400,
           paper_bgcolor: '#fffbe0',
           plot_bgcolor: '#fffbe0',
           showlegend: true,

app/charts/latency-chart.jsx

@@ -67,8 +67,8 @@ const MemoryChart = (props) => {
           {label: xAxis},
         ]}
         layout = {{
-          width: 500,
-          height: 500,
+          width: 400,
+          height: 400,
           paper_bgcolor: '#fffbe0',
           plot_bgcolor: '#fffbe0',
           legend: {

app/charts/memory-chart.jsx

@@ -94,8 +94,8 @@ const MicroServiceTraffic = (props) => {
       }]}
       layout = {
         {
-          width: 500,
-          height: 500,
+          width: 400,
+          height: 400,
           paper_bgcolor: '#fffbe0',
           plot_bgcolor: '#fffbe0',
           legend: {

app/charts/microservice-traffic.jsx

@@ -71,8 +71,8 @@ const ProcessesChart = (props) => {
           {label: communicationLabel},
         ]}
         layout = {{
-          width: 500,
-          height: 500,
+          width: 400,
+          height: 400,
           paper_bgcolor: '#fffbe0',
           plot_bgcolor: '#fffbe0',
           legend: {

app/charts/processes-chart.jsx

@@ -41,8 +41,8 @@ const RequestTypesChart = (props) => {
           },
         }]}
         layout = {{
-          height: 500,
-          width: 500,
+          height: 400,
+          width: 400,
           displaylogo: false,
           paper_bgcolor: '#fffbe0',
           legend: {

app/charts/request-type-chart.jsx

@@ -72,8 +72,8 @@ const ResponseCodeChart = (props) => {
         }
       }]}
       layout = {{
-        height: 500,
-        width: 500,
+        height: 400,
+        width: 400,
         displaylogo: false,
         paper_bgcolor: '#fffbe0',
         legend: {

app/charts/response-code-chart.jsx

@@ -50,8 +50,8 @@ const SpeedChart = (props) => {
           },
         }]}
         layout = {{
-          height: 500,
-          width: 500,
+          height: 400,
+          width: 400,
           paper_bgcolor: '#fffbe0',
           legend: {
             orientation: 'h',

app/charts/speed-chart.jsx

@@ -38,8 +38,8 @@ const TemperatureChart = (props) => {
         }]}
         layout = {
           {
-            width: 500,
-            height: 500,
+            width: 400,
+            height: 400,
             paper_bgcolor: '#fffbe0',
             plot_bgcolor: '#fffbe0',
             legend: {