1

I have been trying to define a function in scope and trigger it when button is clicked in the tooltip. Here is the code that I have been working on in plnkr Clickable tooltips. I have modified plnkr code in the link as shown:

tooltip.contentGenerator(function (d){
          var html =
          '<h3 style="color:white;background-color:black;">' + d.value + '</h3>' +
          '<div class="btn-group-vertical" style="color:white;background-color:black;">' +
          '<div class="inline">'+
          ' <a href="http://www.w3schools.com/html/" class="btn btn-info btn-xs" role="button">ZOOM</a><pre>  '+ d3.time.format('%x')(new Date(d.point.x)) +
          '</pre></div>'+
          '<hr/>'+
          '<div class="inline">'+
          ' <button type="button" class="btn btn-info btn-xs" ng-click="sayHi()">ZOOM</button><pre>  ' + d.point.y +
          '</pre></div>'+
          '<br/>'+
          '</div>';
          return html;
        });

$scope.sayHi = function () {
    console.log('hi');
  };

Thanks in advance.

Michael
  • 123
  • 1
  • 8
  • Yet another question related to the question asked. As far as I know, tooltip is generated just inside the html tag (Outside body tag). Does this not allow it to access a function defined inside the scope of a particular component? If that is the case what has to be done? – Michael Feb 05 '20 at 10:44

0 Answers0