Manage line label visibility when not inside chart area (#790)

Author: stockiNail

src/types/label.js

@@ -1,6 +1,6 @@
 import {Element} from 'chart.js';
 import {drawBox, drawLabel, measureLabelSize, getChartPoint, toPosition, setBorderStyle, getSize, inBoxRange, isBoundToPoint, resolveBoxProperties, getRelativePosition, translate, rotated, getElementCenterPoint} from '../helpers';
-import {toPadding, toRadians, distanceBetweenPoints} from 'chart.js/helpers';
+import {toPadding, toRadians, distanceBetweenPoints, defined} from 'chart.js/helpers';
 
 const positions = ['left', 'bottom', 'top', 'right'];
 
@@ -17,7 +17,8 @@ export default class LabelAnnotation extends Element {
 
   draw(ctx) {
     const options = this.options;
-    if (!options.display || !options.content) {
+    const visible = !defined(this._visible) || this._visible;
+    if (!options.display || !options.content || !visible) {
       return;
     }
     ctx.save();

src/types/line.js

@@ -89,13 +89,14 @@ export default class LineAnnotation extends Element {
       : {x, y, x2, y2, width: Math.abs(x2 - x), height: Math.abs(y2 - y)};
     properties.centerX = (x2 + x) / 2;
     properties.centerY = (y2 + y) / 2;
-    if (!inside) {
-      options.label.display = false;
-    }
+    const labelProperties = resolveLabelElementProperties(chart, properties, options.label);
+    // additonal prop to manage zoom/pan
+    labelProperties._visible = inside;
+
     properties.elements = [{
       type: 'label',
       optionScope: 'label',
-      properties: resolveLabelElementProperties(chart, properties, options.label)
+      properties: labelProperties
     }];
     return properties;
   }