Question

我正在使用Chart.JS（chartjs.org），我想使用facebook like count作为我的图表的数据。

我的饼图工作正常：

<script>
    var pieData = [
            {
                value : 30,
                color : "#f04124"
            },
            {
                value : 70,
                color : "#fff"
            }

        ];

var myPie = new Chart(document.getElementById("chart_01").getContext("2d")).Pie(pieData);

</script>

我正在尝试类似的东西，但它没有用。

<script>
jQuery.getJSON('http://graph.facebook.com/mysiteforchartdata1?callback=?', function(data){
            var fb_count2 = data['likes'].toString();

            $('.facebook_likes').html(fb_count2);
});
jQuery.getJSON('http://graph.facebook.com/mysiteforchartdata2?callback=?', function(data){
            var fb_count2 = data['likes'].toString();

            $('.facebook_likes').html(fb_count2);
});

    var pieData = [
            {
                value : fb_count1,
                color : "#f04124"
            },
            {
                value : fb_count2,
                color : "#fff"
            }

        ];

var myPie = new Chart(document.getElementById("chart_01").getContext("2d")).Pie(pieData);

</script>

我会感谢完整的代码，因为我是javascript的新手。谢谢！

Answer 1

$.getJSON异步工作，因此当您定义pieData时，变量fb_count1和fb_count2尚不存在。您必须执行以下操作：

$.when(
 jQuery.getJSON('http://graph.facebook.com/metallica?callback=?'),
 jQuery.getJSON('http://graph.facebook.com/ironmaiden?callback=?')
).then(function(data1, data2){
 fb_count1 = data1[0]['likes'];
 fb_count2 = data2[0]['likes'];

 console.log([fb_count1, fb_count2]); // you can see the variables are there

 var pieData = [
  {
   value : fb_count1,
   color : "#f04124"
  },
  {
   value : fb_count2,
   color : "#fff"
  }
 ];

 var myPie = new Chart(document.getElementById("chart_01").getContext("2d")).Pie(pieData);
});

$.when是为多个请求（或其他延迟操作）创建回调的便捷方式。如果只有一个请求，您可以正常分配回调：

jQuery.getJSON('http://graph.facebook.com/metallica?callback=?', function(data){
  // now you can do things with data
  // but remember that everything that operates on it should be here
})
// ... and not here

让Facebook赞成Count.JS

1 个答案: