Q:

Display google chart on scrollTop()

I am trying to trigger google chart drawing on a specific event.  In these case it will be scrollTop position (I think it's the best solution here). 
but I don't know what should I do with "setOnLoadCallback", I think this function causes me so much trouble. 
jQuery(document).ready(function ($) {

if ($(window).scrollTop() > 200) {
        google.setOnLoadCallback(drawVisualization2);
    } else {
        //....
    }

});

Of course I can make a workaround here, and draw charts, make them invisible and then display them by adding a class in ex. " .make-visible" when user will be able to view them, but the main purpose I am trying to combine these two is that I don't want to load everything on page load cause it's not necessary, I want to load it when it needed. 
Here's my codepen code with charts.  Thanks in advance for any help. 
http://codepen.io/Nikolaus91/pen/NPmzLw
Funny thing, when launched Chrome's "Inspect element" on my codpen I can see: Jquery is not defined error.  Well... it should be specified, cause I did add it to may codepen in JS settings. 
I don't get it. 

A:

it seems hard coded, however, it works. 
google.load("visualization", "1", {packages:["corechart"], callback: callback });

function callback() {
    $(window).scroll(function() {
        if( $(window).scrollTop() >= 200 ) {        
                drawVisualization1();      
      }  
    });
};

BTW, don't forget to lint your code. 
Demo

