Merge pull request #10 from mtatsuma/day_week

Support days of the week label for the daily forecast chart
mtatsuma · Oct 18, 2020 · c180ed8 · c180ed8
2 parents 0837b1a + d1819d8
commit c180ed8
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 4 deletions.
diff --git a/MMM-WeatherChart.js b/MMM-WeatherChart.js
@@ -35,7 +35,8 @@ Module.register("MMM-WeatherChart", {
         showRain: false,
         color: 'rgba(255, 255, 255, 1)',
         backgroundColor: 'rgba(0, 0, 0, 0)',
-        fillColor: 'rgba(255, 255, 255, 0.1)'
+        fillColor: 'rgba(255, 255, 255, 0.1)',
+        dailyLabel: 'date'
     },
 
     requiresVersion: "2.12.0",
@@ -108,6 +109,18 @@ Module.register("MMM-WeatherChart", {
         return params;
     },
 
+    getDayString: function (num) {
+        let dayString = [];
+        dayString.push('Su.');
+        dayString.push('Mo.');
+        dayString.push('Tu.');
+        dayString.push('We.');
+        dayString.push('Tu.');
+        dayString.push('Fr.');
+        dayString.push('Sa.');
+
+        return dayString[num];
+    },
 
     /* scheduleUpdate()
      * Schedule next update.
@@ -285,7 +298,13 @@ Module.register("MMM-WeatherChart", {
         });
         for (let i = 0; i < Math.min(this.config.dataNum, data.length); i++) {
             const dateTime = new Date(data[i].dt * 1000 + this.config.timeOffsetHours * 60 * 60 * 1000)
-            labels.push(dateTime.getDate());
+            if (this.config.dailyLabel == "date") {
+                labels.push(dateTime.getDate());
+            } else if (this.config.dailyLabel == "days_of_week") {
+                labels.push(this.getDayString(dateTime.getDay()))
+            } else if (this.config.dailyLabel == "date+days_of_week") {
+                labels.push(this.getDayString(dateTime.getDay()) + ' ' + dateTime.getDate())
+            }
             maxTemps.push(Math.round(data[i].temp.max * 10) / 10);
             minTemps.push(Math.round(data[i].temp.min * 10) / 10);
             if (data[i].rain) {

diff --git a/README.md b/README.md
@@ -34,7 +34,7 @@ $ git clone https://github.com/mtatsuma/MMM-WeatherChart.git
                 "dataNum": 12,
                 "dataType": "hourly",
                 "height": "500px",
-                "width": "800px"
+                "width": "800px",
                 "lat": 35.571337,
                 "lon": 139.633989,
                 "units": "metric",
@@ -71,4 +71,5 @@ $ git clone https://github.com/mtatsuma/MMM-WeatherChart.git
 | showRain | | `false` | Show rain volume (mm) on the bottom |
 | color | | `rgba(255, 255, 255, 1)` | Color of line and letters |
 | backgroundColor | | `rgba(0, 0, 0, 0)` | Color of background |
-| fillColor | | `rgba(255, 255, 255, 0.1)` | Color for filling rain volume line |
+| fillColor | | `rgba(255, 255, 255, 0.1)` | Color for filling rain volume line |
+| dailyLabel | | `date` | Label of x-axis for the daily forecast chart. The available labels are `date` or `days_of_week` or `date+days_of_week` |