Week scale - enhance and add to auto-scaling (#3549)

* Move majorLables to 1st week in the month, for 'week' scale * next() always adds 1 week to current date * show 1st week in the month as majorLabel * Add 'week' to auto-scale * Update week scale example * Revert "Move majorLables to 1st week in the month, for 'week' scale" This reverts commit 52df3c3ac54c52abe9386d376924823ac79a6ce0. * Correct value of week's minimumStep
bg · Jun 9, 2019 · f5c42b8 · f5c42b8
1 parent 6ab6eb6
commit f5c42b8
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 5 deletions.
diff --git a/examples/timeline/styling/weekStyling.html b/examples/timeline/styling/weekStyling.html
@@ -26,7 +26,21 @@
     of moment.js including locales.</p>
 <p>To set a locale for the timeline, specify the option
     <code>{locale: STRING}</code>.</p>
-<p>To set the scale to use week numbers, use for example <code>{scale: 'week', step: 1}</code>.</p>
+<p>
+  To set the scale to use week numbers, use the following options:
+  <code>
+    {
+      timeAxis: {
+        scale: 'week',
+        step: 1
+      },
+      format: {
+        minorLabels: {week: 'w'}
+      }
+    }
+  </code>
+</p>
+
 <p>The following timeline is initialized with the 'de' locale and items are added with locally localized moment.js
     objects. The timeline locale can be switched to another locale at runtime. If you choose the 'en' locale, the week
     numbers will be calculated according to the US week calendar numbering scheme.</p>
@@ -93,7 +107,16 @@
     }
 
     // Configuration for the Timeline
-    var options = {timeAxis: {scale: 'week', step: 1}, locale: 'de'};
+    var options = {
+      locale: 'de',
+      timeAxis: {
+        scale: 'week',
+        step: 1
+      },
+      format: {
+        minorLabels: {week: 'w'}
+      }
+    };
 
     // Create a Timeline
     var timeline = new vis.Timeline(container, items, groups, options);
@@ -108,4 +131,4 @@
     select.onchange();
 </script>
 </body>
-</html>
+</html>
diff --git a/lib/timeline/TimeStep.js b/lib/timeline/TimeStep.js
@@ -73,7 +73,7 @@ TimeStep.FORMAT = {
     hour:       'HH:mm',
     weekday:    'ddd D',
     day:        'D',
-    week:       'w',
+    week:       'D',
     month:      'MMM',
     year:       'YYYY'
   },
@@ -340,7 +340,7 @@ TimeStep.prototype.setMinimumStep = function(minimumStep) {
   if (stepYear > minimumStep)             {this.scale = 'year';        this.step = 1;}
   if (stepMonth*3 > minimumStep)          {this.scale = 'month';       this.step = 3;}
   if (stepMonth > minimumStep)            {this.scale = 'month';       this.step = 1;}
-  if (stepDay*5 > minimumStep)            {this.scale = 'day';         this.step = 5;}
+  if (stepDay*7 > minimumStep)            {this.scale = 'week';        this.step = 1;}
   if (stepDay*2 > minimumStep)            {this.scale = 'day';         this.step = 2;}
   if (stepDay > minimumStep)              {this.scale = 'day';         this.step = 1;}
   if (stepDay/2 > minimumStep)            {this.scale = 'weekday';     this.step = 1;}