用户年龄20-30岁有5人，30-40岁有4人，40岁及以上有1人，利用html和css制作一个龄段人数的扇形统计图

好的，我可以帮你制作一个这样的统计图。

首先，我们需要通过 HTML 和 CSS 创建一个带有圆形的容器。

HTML 代码：

<div class="chart">
  <div class="circle"></div>
  <div class="data">
    <div class="row">
      <div class="color" style="background-color: green;"></div>
      <div class="label">20-30岁</div>
      <div class="value">5</div>
    </div>
    <div class="row">
      <div class="color" style="background-color: blue;"></div>
      <div class="label">30-40岁</div>
      <div class="value">4</div>
    </div>
    <div class="row">
      <div class="color" style="background-color: red;"></div>
      <div class="label">40岁及以上</div>
      <div class="value">1</div>
    </div>
  </div>
</div>

然后，在 CSS 中设置容器的样式和数据行的样式。

CSS 代码：

.chart {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 300px;
}

.circle {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  border: 10px solid #f3f3f3;
  position: relative;
}

.row {
  display: flex;
  align-items: center;
  margin: 10px 0;
}

.color {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  margin-right: 10px;
}

.label {
  flex: 1;
}

.value {
  margin-left: 10px;
  font-weight: bold;
}

最后，在 JavaScript 中使用 Canvas 绘制统计图。

JS 代码：

var canvas = document.createElement('canvas');
canvas.width = 200;
canvas.height = 200;

var ctx = canvas.getContext('2d');
var x = canvas.width / 2;
var y = canvas.height / 2;
var radius = 90;
var startAngle = 0;
var endAngle = 0;
var colors = ['#2ecc71', '#3498db', '#e74c3c'];
var values = [5, 4, 1];
var total = values.reduce(function (a, b) {
  return a + b;
});
var lastEndAngle = 0;

for (var i = 0; i < values.length; i++) {
  var value = values[i];
  var percent = value / total;
  startAngle = lastEndAngle;
  endAngle = lastEndAngle + percent * Math.PI * 2;

  ctx.beginPath();
  ctx.moveTo(x, y);
  ctx.arc(x, y, radius, startAngle, endAngle);
  ctx.fillStyle = colors[i];
  ctx.fill();

  lastEndAngle = endAngle;
}

document.querySelector('.circle').appendChild(canvas);

这样，我们就完成了一个利用 HTML、CSS 和 JavaScript 制作的扇形统计图。