半径Rと円の中心O（x0、y0）の中心を持つ円上の点p（x、y）の関係：x = x0+rcosa; y = y0+rsina、aはラジアンです
例：http：//www.zhaojz.com.cn/demo/draw6.html
1。円
コードコピーは次のとおりです。
// circle/ellipse
//ドットドット
// r半径
//圧縮垂直圧縮比
関数drawcircle（dot、r、compressionratio、data）{
var pstart = [dot [0]+r、dot [1]]; //起動点
var pre = pstart;
for（var i = 0; i <360; i+= 5）{
rad = i*math.pi/180; //ラジアンを計算します
//r*math.cos(rad）ドットに対するアークのエンドポイントの水平オフセット
//r*math.sin(rad）ドットに対するアークのエンドポイントの垂直オフセット
//圧縮垂直圧縮比
var cur = [r*math.cos（rad）+dot [0]、compressionratio*r*math.sin（rad）+dot [1]];
ドローライン（pre、cur）;
pre = cur; //現在のポイントの座標を保存します
}
ドローライン（pre、pstart）; //閉じます
//ドットを描画します
drawpoint（{
PW：2、PH：2、Color： 'Darkred'、Point：Dot
}）;
}
2。アーク
円の一部を描くだけで、アルゴリズムは円に似ています
コードコピーは次のとおりです。
//アークを描きます
//ドットドット
// r半径
//角度
// X軸を使用したAngleofslope角度
//ポップがポップアップするかどうか
//タイトルタグ
関数drawarc（dot、r、angle、angleofslope、pop、title）{
var newdot = [dot [0]、dot [1]];
var a =（angleofslope+angle/2）*math.pi/180;
if（pop）{//円の中心の新しい座標を計算します
newdot [0] = dot [0]+10*math.cos（a）;
newdot [1] = dot [1]+10*math.sin（a）;
}
if（！angleofslope）{
AngleOfSlope = 0;
}
var aos = angleofslope*math.pi/180;
var aos2 =（angleofslope+angle）*math.pi/180;
var pstart = [newdot [0]+r*math.cos（aos）、newdot [1]+r*math.sin（aos）]; //アークの開始点
var pend = [newdot [0]+r*math.cos（aos2）、newdot [1]+r*math.sin（aos2）]; //アークのエンドポイント
var pre = pstart;
for（var i = 0; i <angle; i+= 2）{//角度範囲内で弧を描く
rad =（i+angleofslope）*math.pi/180;
var cur = [r*math.cos（rad）+newdot [0]、r*math.sin（rad）+newdot [1]];
ドローライン（pre、cur）;
pre = cur;
}
}
3。ファンの形
アークの両端を円の中心に接続します
コードコピーは次のとおりです。
//セクタ
//ドットドット
// r半径
//角度
// angleofslope x軸間の角度は、セクターの形状の方向を決定します
//ポップがポップアップするかどうか、つまり、それが円の中心から逸脱するかどうか
//タイトルタグ
関数drawsector（dot、r、angle、angleofslope、pop、title）{
var newdot = [dot [0]、dot [1]];
var a =（angleofslope+angle/2）*math.pi/180;
if（pop）{//円の中心の新しい座標を計算します
newdot [0] = dot [0]+10*math.cos（a）;
newdot [1] = dot [1]+10*math.sin（a）;
}
if（！angleofslope）{
AngleOfSlope = 0;
}
var aos = angleofslope*math.pi/180;
var aos2 =（angleofslope+angle）*math.pi/180;
var pstart = [newdot [0]+r*math.cos（aos）、newdot [1]+r*math.sin（aos）]; //アークの開始点
var pend = [newdot [0]+r*math.cos（aos2）、newdot [1]+r*math.sin（aos2）]; //アークのエンドポイント
ドローライン（NewDot、Pstart）; //円の中心と開始点を接続します
var pre = pstart;
for（var i = 0; i <angle; i+= 2）{//角度範囲内で弧を描く
rad =（i+angleofslope）*math.pi/180;
var cur = [r*math.cos（rad）+newdot [0]、r*math.sin（rad）+newdot [1]];
ドローライン（pre、cur）;
pre = cur;
}
drawpolyline（[pre、pend、newdot]）; //閉じます
//円の中心を描きます
drawpoint（{
PW：2、PH：2、Color： 'Darkred'、Point：Dot
}）;
//ラベル
if（title）{
document.write（ "<span style = 'height：24px; line-height：24px; width：80px; text-align：center; color：red; position：aspolute; left："+（newdot [0]+r*（2/4）*math.cos（a）-40）+"px; top："+（newdot [0]+r*（2/4）* "+（newdot [1]+r*（2/4）*math.sin（a）-12）+" '> "+title+" </span> "）;
}
}
衝撃的ではありませんか？ JSはそのようなクールなことをすることができることがわかります。 。 。