Bonjour, 

Je viens de coder un graphique, en javascript que j'ai mis sur mon site HTML. Certes le graphique fonctionne mais l'animation que le graphique est supposé faire se fait avant que l'on scrolle la page.

Je voudrais que l'animation se fasse dès que l'on est sur le graphique et que l'on n'est pas besoin de réactualiser.

Je vous envoie le code Java et HTML.

$('.bar-percentage[data-percentage]').each(function () {
  var progress = $(this);
  var percentage = Math.ceil($(this).attr('data-percentage'));
  $({countNum: 0}).animate({countNum: percentage}, {
    duration: 2000,
    easing:'linear',
    step: function() {
      // What todo on every count
    var pct = '';
    if(percentage == 0){
      pct = Math.floor(this.countNum) + '%';
    }else{
      pct = Math.floor(this.countNum+1) + '%';
    }
    progress.text(pct) && progress.siblings().children().css('width',pct);
    }
  });
});

 
  <div id="bar-1" class="bar-main-container azure">
    <div class="wrap">
      <div class="bar-percentage" data-percentage="38"></div>
      <div class="bar-container">
        <div class="bar"></div>
      </div>
    </div>
  </div>
  
  <div id="bar-2" class="bar-main-container emerald">
    <div class="wrap">
      <div class="bar-percentage" data-percentage="62"></div>
      <div class="bar-container">
        <div class="bar"></div>
      </div>
    </div>
  </div>
  
  <div id="bar-3" class="bar-main-container violet">
    <div class="wrap">
      <div class="bar-percentage" data-percentage="47"></div>
      <div class="bar-container">
        <div class="bar"></div>
      </div>
    </div>
  </div>
  
  <div id="bar-4" class="bar-main-container yellow">
    <div class="wrap">
      <div class="bar-percentage" data-percentage="85"></div>
      <div class="bar-container">
        <div class="bar"></div>
      </div>
    </div>
  </div>
  
  <div id="bar-5" class="bar-main-container red">
    <div class="wrap">
      <div class="bar-percentage" data-percentage="33"></div>
      <div class="bar-container">
        <div class="bar"></div>
      </div>
    </div>
  </div>
  
</div>

J'espère avoir été assez précis dans la description de mon problème. 

Merci d'avance pour vos réponse 

C normale il faut remplire avec tes valeur le code :