Add Image inside an easy pie chart in angular js

Question

I am trying to implement image in my easy pie chart but it is not inside the pie chart but whatever we add is displayed out from the circle/chart. i alse tried two two binding or tried giving ng model but still not working.

Html:

 <script src="https://cdnjs.cloudflare.com/ajax/libs/easy-pie-chart/2.1.6/angular.easypiechart.js" ></script>
     <div easypiechart options="options" percent="percent" ng-model="data" ></div>
   

                            

JS:

var Application = angular.module('Ui', ['ui.bootstrap','easypiechart']);
Application.controller('global',   function($scope,$timeout,dateFilter,$interval) {

    $scope.data =1;
    $scope.percent = 65;
            $scope.options = {
                animate:{
                    duration:0,
                    enabled:false
                },
                barColor:'#2C3E50',
                scaleColor:false,
                lineWidth:2,
                lineCap:'circle'
            };
});

Answer 1

Use this for show percentage and use your js code

<span
    class="chart"
    easypiechart
    ng-init="options = {animate:false,barColor:'#E67E22', scaleColor:false, lineWidth:3, lineCap:'butt' }"
    percent="percent"
    options="options"
>
    <span class="percent" ng-bind="percent"></span>
</span>