Hey there! I'm currently using an Angular bar chart and it's working smoothly. However, I'm facing an issue with displaying tooltips as the series is not functioning correctly. Below is my code snippet. My goal is to have a tooltip appear when the cursor hovers over each bar, showing the corresponding year and data.
HTML
<html ng-app="app">
<head>
<title>Welcome</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js"></script>
<script src="js/app.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
<script src="https://cdn.jsdelivr.net/angular.chartjs/latest/angular-chart.min.js"></script>
</head>
<body ng-controller="ChartController">
<canvas id="bar" class="chart chart-bar" chart-data="data" chart-labels="labels" chart-series="series">
</canvas>
</body>
</html>
Controller
angular.module("app", ["chart.js"]).controller("ChartController", function ($scope) {
$scope.labels = ['2006', '2007', '2008', '2009', '2010', '2011', '2012'];
$scope.series = ['Year', 'Data'];
$scope.data = [65, 59, 80, 81, 56, 55, 40];
});