在scrollTop()上显示谷歌图表

时间:2015-04-06 11:33:16

标签: jquery charts

我正试图在特定事件上触发谷歌图表绘图。在这些情况下,它将是scrollTop位置(我认为这是最好的解决方案)。

但我不知道该怎么办" setOnLoadCallback",我认为这个功能给我带来了很多麻烦。

jQuery(document).ready(function ($) {

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


});

当然我可以在这里做一个解决方法,并绘制图表,使它们不可见,然后通过在ex中添加一个类来显示它们。 "。使可见"当用户能够查看它们时,我试图将这两者结合起来的主要目的是我不想在页面加载时加载所有内容,因为它没有必要,我想在加载时加载它它需要。

这是我的codepen代码和图表。在此先感谢您的帮助。 http://codepen.io/Nikolaus91/pen/NPmzLw

有趣的是,推出Chrome" Inspect element"在我的codpen上我可以看到:Jquery没有定义错误。嗯......它应该被指定,因为我确实将它添加到JS设置中的codepen。

我不明白。

1 个答案:

答案 0 :(得分:0)

似乎硬编码,然而,它有效。

google.load("visualization", "1", {packages:["corechart"], callback: callback });

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

顺便说一下,别忘了给你的代码留言。

Demo