相关疑难解决方法(0)

HTML5 Canvas饼图

我正在尝试创建一个简单的饼图,如下图所示:

在此输入图像描述

该图表将显示测验的结果,用户可以选择a,b或c.它们是10个问题,用户每个问题只能选择一个选项.

我想要做的是通过传递a,b或c的值来显示饼图,每个段是100%的百分比.

到目前为止,我有以下内容:

var greenOne = "#95B524";
var greenTwo = "#AFCC4C";
var greenThree = "#C1DD54";

function CreatePieChart() {
  var chart = document.getElementById('piechart');
  var canvas = chart.getContext('2d');
  canvas.clearRect(0, 0, chart.width, chart.height);

  var total = 100;

  var a = 3;
  var b = 4;
  var c = 3;

  for (var i = 0; i < 3; i++) {
    canvas.fillStyle = "#95B524";
    canvas.beginPath();
    canvas.strokeStyle = "#fff";
    canvas.lineWidth = 3;
    canvas.arc(100, 100, 100, 0, Math.PI * 2, true);
    canvas.closePath();
    canvas.stroke();
    canvas.fill();
  }
} …
Run Code Online (Sandbox Code Playgroud)

javascript canvas

22
推荐指数
2
解决办法
5万
查看次数

标签 统计

canvas ×1

javascript ×1