title: How to move labels' position on Chart.js pie
body: <p>I'm using Chart.js and I'm trying to move the labels on my Pie chart outside of the pie area (see red X's):</p>
  
  <p><a href="https://i.stack.imgur.com/mkM7H.png" rel="noreferrer"><img src="https://i.stack.imgur.com/mkM7H.png" alt="enter image description here"></a></p>
  
  <p>This my code right now:</p>
  
  <pre><code>&lt;div class="container" id="pieContainer"&gt;
      &lt;h4 class="title"&gt;Title&lt;/h4&gt;
      &lt;center&gt;&lt;canvas id="pie"&gt;&lt;/canvas&gt;&lt;/center&gt;
  &lt;/div&gt;
  
  &lt;script&gt;                                  
      var pieData = [
      {
          value: 39,
          color:"#335478",
          label: "Blue"
      },
      {
          value : 4,
          color : "#7f7f7f",
          label: "Grey"
      },
      {
          value : 57,
          color : "#99cb55",
          label: "Green"
      }
      ];
  
      var optionsPie = {
          responsive : true,
          tooltipEvents: [],
          showTooltips: true,
          onAnimationComplete: function() {
               this.showTooltip(this.segments, true);
          },
          tooltipTemplate: "&lt;%= label %&gt; - &lt;%= value %&gt;%"
      };
      new Chart(document.getElementById("pie").getContext("2d")).Pie(pieData, optionsPie);
  &lt;/script&gt;
  </code></pre>
  
  <p>I don't want to use legends and I couldn't find a built-in method to move labels. Is there a way to do that without changing <code>chart.js</code>? What's the best way to achieve my goal?</p>