Добавить изображение внутри простой круговой диаграммы в angular js

Question

Я пытаюсь реализовать изображение в своей простой круговой диаграмме, но оно не находится внутри круговой диаграммы, но все, что мы добавляем, отображается из круга / диаграммы. Я также пробовал две привязки или пытался дать модель, но все еще не работал.

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

Используйте это для отображения процента и используйте свой js-код

      <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>