Need SVG animation to load on scroll

Logic says remove the below function from your EVO js file, which is right at the start of the file, then use the well documented script for checking if a container comes into the viewport in your page and insert the function you removed from the EVO js file were it says -

INSERT THE ABOVE FUNCTION HERE

(see below)

See if that works.

Remove the below from EVO js file:

$(function(){

$("#doughnutChart").drawDoughnutChart([

{ title: "Tokyo",         value : 120,  color: "#003b49" },

{ title: "San Francisco", value:  9,   color: "#0091b3" },

{ title: "New York",      value:  6,   color: "#8dc7d8" },

{ title: "London",        value : 120,   color: "#7a979f" },

{ title: "Berlin",        value : 40,   color: "#ffc627" }

]);

});

Insert the above function into the script below (which should go in your page inplace of the other one you currently have) to check when a container comes into viewport:

<script>

function isInView(elem)

{

var docViewTop = $(window).scrollTop();

var docViewBottom = docViewTop + $(window).height() - 200;

var elemTop = $(elem).offset().top;

return ((elemTop <= docViewBottom) && (elemTop >= docViewTop));

}

$(window).scroll(function(){

if (isInView($('#doughnutChart'))) {

INSERT THE ABOVE FUNCTION HERE

$(window).off('scroll');

}

})

</script>