我正在尝试将多个 RGraphs 画布添加到网站答案

【问题标题】：I'm trying to add multiple RGraphs canvases to website我正在尝试将多个 RGraphs 画布添加到网站
【发布时间】：2013-04-08 14:40:29
【问题描述】：

我想在同一页面上显示针对多个配置文件（从 mysql 数据库创建的列表）的饼图。我目前正在使用 iframe 从另一个页面调用饼图，但有更好的方法吗？每个图表都有不同的值。是否可以在画布上创建函数？

<canvas id="cvs" width="100" height="100" >[No canvas support]</canvas>
    <script>
        window.onload = function ()
        {
            var donut = new RGraph.Pie('cvs', [17,40,25,8]);
            donut.Set('chart.variant', 'donut');
            donut.Set('chart.tooltips', ['Standard','Location','Social']);
            donut.Set('chart.strokestyle', 'transparent');
            donut.Set('chart.exploded', 2);

            donut.Set('chart.gutter.left', 5);
            donut.Set('chart.gutter.top', 5);
            donut.Set('chart.gutter.right', 5);
            donut.Set('chart.gutter.bottom', 5);

            donut.Set('chart.colors', ['rgba(222,82,49,0.15)','rgba(222,82,49,0.40)','rgba(222,82,49,0.80)','rgba(222,82,49,0)']);

            donut.Draw();
        }

    </script>

【问题讨论】：

标签： jquery rgraph

【解决方案1】：

是的，您可以在同一画布上显示不同的图表。

在可下载的存档中有一个演示，它显示了这个名称：

demos/bar-css3-animations.html

您可以在此处下载 RGraph 存档：

https://www.rgraph.net/download.html#stable

您可以拥有创建和显示每个图表的函数：

function ShowChart1 ()
{
    RGraph.Reset(canvas);

    // Create and show first chart
}

function ShowChart2 ()
{
    RGraph.Reset(canvas);

    // Create and show second chart
}

【讨论】：