Круговая диаграмма

Ранее мы видели пример программы для рисования круговой диаграммы. Поменяйте её, чтобы имя каждой категории было показано рядом с куском, который её представляет. Попробуйте отыскать симпатичный вариант автоматического позиционирования текста, который бы работал и на других наборах данных. Можно предположить, что нет категории меньше 5% (чтобы текст не громоздился друг на друга).

Вам снова могут понадобиться Math.sin и Math.cos.

<canvas width="600" height="300"></canvas>

<script>

  var cx = document.querySelector("canvas").getContext("2d");

  var total = results.reduce(function(sum, choice) {

    return sum + choice.count;

  }, 0);

  var currentAngle = -0.5 * Math.PI;

  var centerX = 300, centerY = 150;

  // Добавьте код для вывода меток

  results.forEach(function(result) {

    var sliceAngle = (result.count / total) * 2 * Math.PI;

    cx.beginPath();

    cx.arc(centerX, centerY, 100,

           currentAngle, currentAngle + sliceAngle);

    currentAngle += sliceAngle;

    cx.lineTo(centerX, centerY);

    cx.fillStyle = result.color;

    cx.fill();

  });

</script>