円：罫線の最大（x、y）座標を取得

Question

コンテナサークル（赤色）、140px半径を持っています。 Javascriptでは、このコンテナに小さな円を追加します。この円のxおよびy座標は動的に設定されます。

場合によっては、青色の円がコンテナの外側に描画されることがあります。この円をコンテナの境界線に配置するためにx座標とy座標を再計算したいと思います。私が持っているもの

：私が欲しいもの

：

私は数学の式と複雑な手作りのソリューションの多くをテストし、CSS/jQueryを使ってとSVGで試してみました...

私が試したことのいくつかの例：

1. 私のコンテナをいくつかの領域で「カット」すると、各領域にxまたはy maxがあります。

、私のような条件の多くを書いた後：...

if (y >= 70 && y <= 210 && x >= 280) { 
x = 250; 
} 

そうでもない実用的なSOで

を、私はすべての周りに円を描き、このコードを見つけました私のコンテナ。

私は青い丸の位置を正規化する方法のために...

検索本当に

var item = 5; 
for(var i =0; i<items; i++){ 
var x = 140 + 140*Math.cos(2*Math.PI*i/items); 
var y = 140 + 140*Math.sin(2*Math.PI*i/items); 
} 

しませんか？

ありがとうございます！

Answer 1

はに（大きな円は、（あなたが言っている140px）中央(X,Y)と半径Rを持っていると仮定して、少しの円は半径rがあると、あなたは、より大きな円の境界に角度thetaにある小さな円が欲しいですあなたの写真は約70度のように見えます）。小さな円の中心の座標は次のようになります。

((R-r)cos(theta)+X, (R-r)sin(theta)+Y) 

Answer 2

（私たちはそのmippleがx = 0とy = 0であると仮定した場合）あなたのサークルの座標を与える式がx^2 + y^2 = 140^2です。

あなたは半径rの青い円を持っており、青い円の中心はx^2 + y^2 = (140 - r)^2にあります。

これで、すべてのxがy座標を見つけるのは簡単です。

y1 = sqrt((140 - r)^2 - x^2)

と

y2 = -sqrt((140 - r)^2 - x^2)

値（赤い円の中心の座標）にオフセットを検討。