[Artem_A]

в общем мы сделали, вот код

var progressBarArray1 = ["0.75","0.36","0.21"];
var progressBarArray2 = ["0.25","0.43","0.33"];
var progressBarArray3 = ["0.40","0.75","0.54"];
var progressBarArray4 = ["0.75","0.78","0.46"];

var progressBarArrays = [progressBarArray1,progressBarArray2,progressBarArray3,progressBarArray4];
$(function(){
var circles = $('div.circle');
var lis = $('#nav_slider a');
lis.on('click', function (a) {
 var inx = $(this).index();

 circles.each(function(element){
   $(this).circleProgress({
       startAngle: -Math.PI /2 * 8 ,
       size: 130,
       lineCap: 'round',
       value: progressBarArrays[inx][element],
       thickness: 4,
       fill: {color: '#19bd9a' },
       emptyFill: 'rgba(4, 115, 120, 1)'
   }).on('circle-animation-progress', function(event, progress, stepValue) {
     $(this).find('strong').text((100 * stepValue).toFixed(0) + '%');
   });
 })
});

$('.activeSlide.detailsIcon').click()


var el = $('div.circle');
 var inited = false;

 el.appear({ force_process: true });

 el.on('appear', function() {
   if(!inited){
     $(this).circleProgress({
       value: $(this).data("value")
     });
     //inited = true;
   }
 });
});