Question

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

我找到了FLOT和Graphael，两者都很好，但我没有找到任何初学者教程。

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

是否有任何初学者教程？

Answer 1

饼图示例： -

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图形库中，Flot实际上实现了“有吸引力的Javascript绘图”的目标。

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

使用Flot创建饼图就像

一样简单

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

确保在文档的标题中正确包含JQuery和Flot。如果您需要帮助格式化要绘制的数据集并选择绘制图表的方式，请参考Flot API Documentation，这是明确的并包含许多示例。

就从数据库中检索数据而言，您可以通过AJAX执行此操作。 Here is an example使用JQuery通过AJAX检索数据并使用Flot绘制数据，其工作方式如下：

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

如果您需要更多帮助，请查看JQuery AJAX documentation。

Answer 3

this question的答案中有一些不错的建议。

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

在JavaScript中的饼图？

3 个答案: