title: Angular 2 ng2-charts doughnut text in the middle disappears on mouse hover
body: <p>I have tried the solution posted in <a href="https://stackoverflow.com/a/43079901/2621320">this</a> question to put a text inside (in the middle, vertical and horizontally aligned) of a donut chart and it works almost perfectly. The issue is that every time the mouse hovers over the chart, the text flashes. It seems like this happens because when the mouse hovers over the chart, the function that handles the text writing is called again.</p>
  
  <p>My component code is something like:</p>
  
  <pre><code>imports ....
  
  @Component({
      selector: 'my-component-app',
      templateUrl: '../views/my-component.component.html',
      styleUrls: ['../styles/my-component.component.css']
  })
  
  export class MyComponent implements OnInit {
      chartOptions;
      chartLabales;
      chartData;
  
      ngOnInit(): {
          this.chartData = ....
          this.chartOptions = ....
      }
  }
  </code></pre>
  
  <p>Any idea about how to solve this problem ? Thanks</p>