2

kinetic、Raphael などの js ライブラリを使用せずに JavaScript を使用して円グラフの各セクションにツール ヒントを表示するにはどうすればよいですか。

<script type="text/javascript">

function draw()
{

 var can=document.getElementById("can");
 var ctx=can.getContext("2d");

 var w=can.width/2;
 var h=can.height/2; 
  var total=startangle=endangle=radius=slices=0;
  var data=[25,25,25,25];

  var color=['red','green','blue','purple'];
  var subdata=[2,5];
  //collecting total value of pie
  for(var k =0;k<data.length;k++)
   {
total+=data[k];  
   }
  //generate pie
   for(var i=0;i<data.length;i++)
    {
 slices=(data[i]/total);
 radius=2*Math.PI*slices;
 endangle=startangle+radius;
 ctx.beginPath();
 ctx.arc(w, h, 75, startangle, endangle);
 ctx.lineTo(w,h);
 ctx.closePath();
 startangle+=radius;
 ctx.fillStyle=color[i];
 ctx.fill();
 ctx.lineWidth=2;

 ctx.stroke();
 }
 }

    </script>
4

1 に答える 1

3

幸いなことに、Elated.comのMattDoyleとSimonMeekには、探しているものを正確に示すチュートリアルがあります。それをチェックしてください：http ：//www.elated.com/articles/snazzy-animated-pie-chart-html5-jquery/

于 2013-02-11T16:51:34.157 に答える