饼图中的饼图？

Question

我想使用从数据库检索的一组数据创建饼图。

我发现了FLot和Graphael，两者都很不错，但是我没有找到任何初学者教程。

如何开始在我的代码中添加饼图？

是否有任何初学者教程？

Answer 1

尝试bluff charts。

的饼图示例： -

function pieChartExample(){ 
    //Create pie chart 
    var bluffGraph = new Bluff.Pie('bluffExample', 400); 
    //Use keynote theme. Several other themes can be used 
    bluffGraph.theme_keynote(); 
    bluffGraph.title = 'Pass Vs Fail'; 

    bluffGraph.data('Pass',75,'green'); 
    bluffGraph.data('Fail',25,'red'); 

    bluffGraph.draw(); 
} 

Answer 2

我个人认为出所有的JavaScript图形库，实际上海军报辜负的是它的目标。“有吸引力的Javascript绘图。”

这里are a number of examples这应该让你开始在Flot中创建饼图。

创建与海军报一个饼图是那么容易，因为

$.plot($("#default"), data, 
{ 
     series: { 
      pie: { 
       show: true 
      } 
     } 
}); 

确保包括jQuery和海军报在正确的文档的标题。如果您需要帮助格式化要绘制的数据集并选择如何绘制图表的选项，请参考Flot API Documentation，这很清晰并包含许多示例。

只要从数据库中检索数据，你可以通过AJAX来完成。使用JQuery通过AJAX检索数据，并与海军报，其工作方式绘制数据Here is an example如下：

$.ajax({ 
     url: dataurl, 
     method: 'GET', 
     dataType: 'json', 
     success: onDataReceived 
}); 

看那JQuery AJAX documentation如果你需要更多的帮助。

Answer 3

在this question的答案中有几个很好的建议。

你提到你找不到gRaphael的文档，但RaphaelJs实际上有一些documentation，这是gRaphael的基础。