Exclude base-line from bar size

src/controllers/controller.bar.js

@@ -447,6 +447,18 @@ export default class BarController extends DatasetController {
       head = base + size;
     }
 
+    const actualBase = baseValue || 0;
+    if (base === vScale.getPixelForValue(actualBase)) {
+      const halfGrid = vScale.getLineWidthForValue(actualBase) / 2;
+      if (size > 0) {
+        base += halfGrid;
+        size -= halfGrid;
+      } else if (size < 0) {
+        base -= halfGrid;
+        size += halfGrid;
+      }
+    }
+
     return {
       size,
       base,

src/core/core.scale.js

@@ -1604,6 +1604,21 @@ export default class Scale extends Element {
     }
   }
 
+  getLineWidthForValue(value) {
+    const me = this;
+    const grid = me.options.grid;
+    if (!me._isVisible() || !grid.display) {
+      return 0;
+    }
+    const ticks = me.ticks;
+    const index = ticks.findIndex(t => t.value === value);
+    if (index >= 0) {
+      const opts = grid.setContext(me.getContext(index));
+      return opts.lineWidth;
+    }
+    return 0;
+  }
+
   /**
 	 * @protected
 	 */

test/fixtures/controller.bar/baseLine/bottom.js

@@ -0,0 +1,40 @@
+module.exports = {
+  config: {
+    type: 'bar',
+    data: {
+      labels: ['a', 'b'],
+      datasets: [{
+        backgroundColor: '#AAFFCC',
+        borderColor: '#0000FF',
+        borderWidth: 1,
+        data: [1, 2]
+      }]
+    },
+    options: {
+      scales: {
+        x: {
+          display: false
+        },
+        y: {
+          ticks: {
+            display: false
+          },
+          grid: {
+            color: function(context) {
+              return context.tick.value === 0 ? 'red' : 'transparent';
+            },
+            lineWidth: 5,
+            tickLength: 0
+          },
+        }
+      },
+      maintainAspectRatio: false
+    }
+  },
+  options: {
+    canvas: {
+      width: 128,
+      height: 128
+    }
+  }
+};

test/fixtures/controller.bar/baseLine/left.js

@@ -0,0 +1,41 @@
+module.exports = {
+  config: {
+    type: 'bar',
+    data: {
+      labels: ['a', 'b'],
+      datasets: [{
+        backgroundColor: '#AAFFCC',
+        borderColor: '#0000FF',
+        borderWidth: 1,
+        data: [1, 2]
+      }]
+    },
+    options: {
+      indexAxis: 'y',
+      scales: {
+        y: {
+          display: false
+        },
+        x: {
+          ticks: {
+            display: false
+          },
+          grid: {
+            color: function(context) {
+              return context.tick.value === 0 ? 'red' : 'transparent';
+            },
+            lineWidth: 5,
+            tickLength: 0
+          },
+        }
+      },
+      maintainAspectRatio: false
+    }
+  },
+  options: {
+    canvas: {
+      width: 128,
+      height: 128
+    }
+  }
+};

test/fixtures/controller.bar/baseLine/mid-x.js

@@ -0,0 +1,41 @@
+module.exports = {
+  config: {
+    type: 'bar',
+    data: {
+      labels: ['a', 'b'],
+      datasets: [{
+        backgroundColor: '#AAFFCC',
+        borderColor: '#0000FF',
+        borderWidth: 1,
+        data: [1, -1]
+      }]
+    },
+    options: {
+      indexAxis: 'y',
+      scales: {
+        y: {
+          display: false
+        },
+        x: {
+          ticks: {
+            display: false
+          },
+          grid: {
+            color: function(context) {
+              return context.tick.value === 0 ? 'red' : 'transparent';
+            },
+            lineWidth: 5,
+            tickLength: 0
+          },
+        }
+      },
+      maintainAspectRatio: false
+    }
+  },
+  options: {
+    canvas: {
+      width: 128,
+      height: 128
+    }
+  }
+};

test/fixtures/controller.bar/baseLine/mid-y.js

@@ -0,0 +1,40 @@
+module.exports = {
+  config: {
+    type: 'bar',
+    data: {
+      labels: ['a', 'b'],
+      datasets: [{
+        backgroundColor: '#AAFFCC',
+        borderColor: '#0000FF',
+        borderWidth: 1,
+        data: [1, -1]
+      }]
+    },
+    options: {
+      scales: {
+        x: {
+          display: false
+        },
+        y: {
+          ticks: {
+            display: false
+          },
+          grid: {
+            color: function(context) {
+              return context.tick.value === 0 ? 'red' : 'transparent';
+            },
+            lineWidth: 5,
+            tickLength: 0
+          },
+        }
+      },
+      maintainAspectRatio: false
+    }
+  },
+  options: {
+    canvas: {
+      width: 128,
+      height: 128
+    }
+  }
+};

test/fixtures/controller.bar/baseLine/right.js

@@ -0,0 +1,42 @@
+module.exports = {
+  config: {
+    type: 'bar',
+    data: {
+      labels: ['a', 'b'],
+      datasets: [{
+        backgroundColor: '#AAFFCC',
+        borderColor: '#0000FF',
+        borderWidth: 1,
+        data: [-1, -2]
+      }]
+    },
+    options: {
+      indexAxis: 'y',
+      scales: {
+        y: {
+          display: false
+        },
+        x: {
+          ticks: {
+            display: false
+          },
+          grid: {
+            color: function(context) {
+              return context.tick.value === 0 ? 'red' : 'transparent';
+            },
+            lineWidth: 5,
+            tickLength: 0,
+            borderWidth: 0
+          },
+        }
+      },
+      maintainAspectRatio: false
+    }
+  },
+  options: {
+    canvas: {
+      width: 128,
+      height: 128
+    }
+  }
+};

test/fixtures/controller.bar/baseLine/top.js

@@ -0,0 +1,41 @@
+module.exports = {
+  config: {
+    type: 'bar',
+    data: {
+      labels: ['a', 'b'],
+      datasets: [{
+        backgroundColor: '#AAFFCC',
+        borderColor: '#0000FF',
+        borderWidth: 1,
+        data: [-1, -2]
+      }]
+    },
+    options: {
+      scales: {
+        x: {
+          display: false
+        },
+        y: {
+          ticks: {
+            display: false
+          },
+          grid: {
+            color: function(context) {
+              return context.tick.value === 0 ? 'red' : 'transparent';
+            },
+            borderWidth: 0,
+            lineWidth: 5,
+            tickLength: 0
+          },
+        }
+      },
+      maintainAspectRatio: false
+    }
+  },
+  options: {
+    canvas: {
+      width: 128,
+      height: 128
+    }
+  }
+};

test/fixtures/controller.bar/baseLine/value-x.js

@@ -0,0 +1,42 @@
+module.exports = {
+  config: {
+    type: 'bar',
+    data: {
+      labels: ['a', 'b'],
+      datasets: [{
+        backgroundColor: '#AAFFCC',
+        borderColor: '#0000FF',
+        borderWidth: 1,
+        data: [1, 3]
+      }]
+    },
+    options: {
+      base: 2,
+      indexAxis: 'y',
+      scales: {
+        y: {
+          display: false
+        },
+        x: {
+          ticks: {
+            display: false
+          },
+          grid: {
+            color: function(context) {
+              return context.tick.value === 2 ? 'red' : 'transparent';
+            },
+            lineWidth: 5,
+            tickLength: 0
+          },
+        }
+      },
+      maintainAspectRatio: false
+    }
+  },
+  options: {
+    canvas: {
+      width: 128,
+      height: 128
+    }
+  }
+};

test/fixtures/controller.bar/baseLine/value-y.js

@@ -0,0 +1,41 @@
+module.exports = {
+  config: {
+    type: 'bar',
+    data: {
+      labels: ['a', 'b'],
+      datasets: [{
+        backgroundColor: '#AAFFCC',
+        borderColor: '#0000FF',
+        borderWidth: 1,
+        data: [1, 3]
+      }]
+    },
+    options: {
+      base: 2,
+      scales: {
+        x: {
+          display: false
+        },
+        y: {
+          ticks: {
+            display: false
+          },
+          grid: {
+            color: function(context) {
+              return context.tick.value === 2 ? 'red' : 'transparent';
+            },
+            lineWidth: 5,
+            tickLength: 0
+          },
+        }
+      },
+      maintainAspectRatio: false
+    }
+  },
+  options: {
+    canvas: {
+      width: 128,
+      height: 128
+    }
+  }
+};