diff --git a/examples/demo.html b/examples/demo.html
index 7ec1ac9..4341783 100755
--- a/examples/demo.html
+++ b/examples/demo.html
@@ -26,8 +26,6 @@
           },
           stacked: false,
           matching: false,
-          maxBarWidth: 20,
-          minBarWidth: 4,
           zoomEvents: {
             scroll: { zoom: { isActive: false },  pan: { isActive: false }  },
           },
@@ -47,7 +45,7 @@
 
       function getData() {
         return [
-          [100, 15], [200, 20], [300, 10],
+          [0, 15], [1, 20], [2, 10],
         ];
       }
     </script>
diff --git a/src/index.ts b/src/index.ts
index 67cbe0a..f02828a 100755
--- a/src/index.ts
+++ b/src/index.ts
@@ -282,9 +282,11 @@ export class ChartwerkBarPod extends ChartwerkPod<BarSerie, BarOptions> {
   }
 
   get barWidth(): number {
-    // TODO: here we use first value + timeInterval as bar width. It is not a good idea
     const xAxisStartValue = _.first(this.series.visibleSeries[0].datapoints)[0];
-    let width = this.state.xScale(xAxisStartValue + this.timeInterval) / 2;
+    const xAxisEndValue = _.last(this.series.visibleSeries[0].datapoints)[0];
+    const timeInterval = (xAxisEndValue - xAxisStartValue) / this.series.visibleSeries[0].datapoints.length;
+    console.log(xAxisStartValue, xAxisEndValue, timeInterval);
+    let width = this.state.xScale(timeInterval) / 2;
     if(this.options.barOptions.barWidth !== undefined) {
       // barWidth now has axis-x dimension
       width = this.state.xScale(this.state.getMinValueX() + this.options.barOptions.barWidth);
diff --git a/yarn.lock b/yarn.lock
index 7b58e0f..a25056b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -20,12 +20,12 @@ __metadata:
   linkType: soft
 
 "@chartwerk/core@npm:latest":
-  version: 0.6.10
-  resolution: "@chartwerk/core@npm:0.6.10"
+  version: 0.6.26
+  resolution: "@chartwerk/core@npm:0.6.26"
   dependencies:
-    d3: ^5.7.2
-    lodash: ^4.14.149
-  checksum: 6a7f187b77878f20ba696a2bbd843bb57d8891efd69e578c946f56f501f679531efa42a33aa243b7fb5e52f6ca06a49a357fb37bcf99d8c32c1c46e4d27fcb2d
+    d3: ^5.16.0
+    lodash: ^4.17.21
+  checksum: d77ef83701dc13cf2b7fb36dc96448060b6301928bcc0730a7150930f83c51f295e176bcda4e1b8cb8f56d15fef5696edfe6f4e1033adbb5ef5d3487a02c3390
   languageName: node
   linkType: hard
 
@@ -806,7 +806,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"d3@npm:^5.7.2":
+"d3@npm:^5.16.0":
   version: 5.16.0
   resolution: "d3@npm:5.16.0"
   dependencies:
@@ -1142,7 +1142,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"lodash@npm:^4.14.149":
+"lodash@npm:^4.17.21":
   version: 4.17.21
   resolution: "lodash@npm:4.17.21"
   checksum: eb835a2e51d381e561e508ce932ea50a8e5a68f4ebdd771ea240d3048244a8d13658acbd502cd4829768c56f2e16bdd4340b9ea141297d472517b83868e677f7