[リストへもどる]   [VBレスキュー(花ちゃん)]
一括表示

投稿時間:2004/12/10(Fri) 11:26
投稿者名:ダンボ
URL :
タイトル:
複数のボタンを楕円で過不足無く囲む描画
ここのところ作っているアプリケーションでは「複数のボタンを(楕円)で過不足無く取り囲む描画」を
実現したいと考えています。なかなか楽し苦しい課題だと思いませんか。

・ボタン2つであっても、端点は8つあるから楕円は確定する。
・長軸/短軸の向きを自由にすればもっと過不足無い楕円が出来るが、コーディングが苦しくなるので
 一応、画面のX軸/Y軸方向に合わせた楕円に限定する(かな?)。
・楕円という制限を外して、「滑らかな自由曲線で」にすればベジェ曲線APIが使えそう。
・とにかくボタンn個に対して4n個の点の「一番外側」の点を決めていかなければならない。

こういう仕様、実現方式、アルゴリズムについてサゼスチョンがありましたらお願いします。
また、「そういう話題、アルゴリズムについてはこの会議室が良い」というものがありましたら
ご紹介ください。

投稿時間:2004/12/11(Sat) 11:58
投稿者名:ダンボ
URL :
タイトル:
XY軸方向に合わせた楕円ならば
> ・ボタン2つであっても、端点は8つあるから楕円は確定する。
> ・長軸/短軸の向きを自由にすればもっと過不足無い楕円が出来るが、コーディングが苦しくなるので
>  一応、画面のX軸/Y軸方向に合わせた楕円に限定する(かな?)。
> ・楕円という制限を外して、「滑らかな自由曲線で」にすればベジェ曲線APIが使えそう。
> ・とにかくボタンn個に対して4n個の点の「一番外側」の点を決めていかなければならない。

(1)4n個の端点を比較して、一番左上・右上・左下・右下の点の座標を求める。 … 易
(2)その4点を囲む長方形を求める。但し向きはXY軸に平行とする。 … 易
(3)その長方形に外接する楕円を求める。 … やや難
(4)その楕円の中心点・長軸・短軸を求める。 … 易

これで、XY軸方向に合わせた楕円は画けるかな?
ただ、ボタンの配置によっては無駄の多い楕円になるのでXY軸平行の制限ははずしたい。

投稿時間:2004/12/13(Mon) 00:05
投稿者名:Say
Eメール:
URL :
タイトル:
Re: XY軸方向に合わせた楕円ならば
> (3)その長方形に外接する楕円を求める。 … やや難
> (4)その楕円の中心点・長軸・短軸を求める。 … 易
>
> これで、XY軸方向に合わせた楕円は画けるかな?
> ただ、ボタンの配置によっては無駄の多い楕円になるのでXY軸平行の制限ははずしたい。

「ある長方形に外接する楕円」なんて、無限にあるのだが・・・。
なんでもいいのなら、扁平率を0にすれば簡単にもとまるかと。
軸の回転も気にする必要なくなるし。

投稿時間:2004/12/13(Mon) 08:11
投稿者名:ダンボ
URL :
タイトル:
Re^2: XY軸方向に合わせた楕円ならば
> 「ある長方形に外接する楕円」なんて、無限にあるのだが・・・。

をぉ。ありました。「やや難」ではなく、「不定」ですね。

> なんでもいいのなら、扁平率を0にすれば簡単にもとまるかと。

「円」ですね。扁平率を決める要素といえば、
・見映え
・無駄が少ない

→「面積が一番小さくなるような扁平率」というのはどうでしょうか?

投稿時間:2004/12/13(Mon) 10:39
投稿者名:ダンボ
URL :
タイトル:
Re^3: XY軸方向に合わせた楕円ならば
> 「円」ですね。扁平率を決める要素といえば、
> ・見映え
> ・無駄が少ない
>
> →「面積が一番小さくなるような扁平率」というのはどうでしょうか?

数式で検証してからの話になりますが、経験則からは、面積最小になる場合といえば
「真円」 か 「極端に(無限に)細長い楕円」のどちらかになりそうです。どちらも見映えには難あり。

見映え重視で行けば、
・画面の横縦比(1024:764あるいは800:600)
・印刷時の横縦比(A3あるいはA4)
での扁平比率で実現すれば妥当なのかも。

投稿時間:2004/12/15(Wed) 10:16
投稿者名:ダンボ
URL :
タイトル:
楕円でなく滑らかな曲線で囲む場合(完成)
ボタンn個に対して4n個の点の「一番外側」の点を決めてベジェ曲線で繋ぐと言うのも1方法です。

基本方法:中心点を求めて、原点移動・極座標化までは他と同じ。
注目する1個のボタンの4端点のうち、中心点からの距離が一番遠いものをそのボタンの描画点とする。

具体的方法:
・中心点を、(4n個のX座標の単純平均、4n個のY座標の単純平均)とする。
・中心点を(0,0)とした座標系に平行移動する。
・各ボタンiに付き、4個の点を新座標系の極座標で表す。(R,T)=(root(X*X+Y*Y),arccos(X,R))
・各ボタンiに付き、Rが最大の点の座標を記録する。
・後は座標系を戻して行って、n個の端点をベジェ曲線で繋ぐ。

投稿時間:2004/12/13(Mon) 08:27
投稿者名:ダンボ
URL :
タイトル:
超楕円ならば
1.中心点の求めかたを、(4n個のX座標の単純平均、4n個のY座標の単純平均)とする。
2.その中心点から一番遠い点と中心点を長軸線とする。
3.その中心点から一番近い点と中心点を短軸線とする。

問題点:
・3は嘘。もうひとひねり要る。
・XY座標の単純平均が、中心点として本当に妥当か。馬蹄形や三日月に分布していた場合も?
・楕円じゃない場合が殆どなので、方程式が作れない。。。
 (直交する場合は長軸と短軸が確定すれば楕円の方程式は決まるよね?)

投稿時間:2004/12/13(Mon) 11:03
投稿者名:ダンボ
URL :
タイトル:
中心と長軸を決定してから短軸を模索する
> ・XY座標の単純平均が、中心点として本当に妥当か。馬蹄形や三日月に分布していた場合も?

特殊な分布の場合は、もともと「楕円で囲む」に無理があるので考えから外します。
すると1と2は妥当そうなので、「中心と長軸を決定してから短軸を長くして全ての点が楕円内に収まる」
方式はどうでしょうか?

1.中心点の求めかたを、(4n個のX座標の単純平均、4n個のY座標の単純平均)とする。
2.その中心点から一番遠い点と中心点を長軸線とする。=長軸の長さ決定
3.その長軸線に垂直な短軸線を中心点から生やす。
4.短軸の長さを0から一定間隔で増やす。全ての点が楕円内に収まるまで。

4が気持ち悪い。極座標を使うとして。4nの点を極座標変換して。一番長いもの=長軸。
(以下、未完成)

投稿時間:2004/12/14(Tue) 03:25
投稿者名:Renard
Eメール:
URL :
タイトル:
Re: 中心と長軸を決定してから短軸を模索する
> 4が気持ち悪い。極座標を使うとして。4nの点を極座標変換して。一番長いもの=長軸。
> (以下、未完成)

長軸と短軸を黄金比にしてみたら、美しくなるかも?

黄金比の楕円ってのは、見たこと無いけど^^

投稿時間:2004/12/14(Tue) 10:04
投稿者名:ダンボ
URL :
タイトル:
Re^2: 中心と長軸を決定してから短軸を模索する
> 長軸と短軸を黄金比にしてみたら、美しくなるかも?
> 黄金比の楕円ってのは、見たこと無いけど^^

Renardさん、面白いアイデアを有難うございます。
万古の知恵ですので、大方の人に美しく感じられるかも知れません。
短軸:長軸 = 1 : 1.618

なお、Web検索で次のような記述もあり、わが意を得たりかな?

また類似の安定した比として白銀比がある。1 : √2 = 1 : 1.414... で表される比であり、
用紙サイズ(A3, A4 など)、建物などに使われる比である。この比となる長方形は白銀長方形といわれる。
黄金比が約 5 : 8 なのに対して 約 5 : 7 の比である。

投稿時間:2004/12/14(Tue) 10:25
投稿者名:ダンボ
URL :
タイトル:
中心と長軸を決定してから短軸を模索する(完成)
1.中心点の求めかたを、(4n個のX座標の単純平均、4n個のY座標の単純平均)とする。
2.その中心点から一番遠い点と中心点を長軸線とする。=長軸の長さ決定
3.その長軸線に垂直な短軸線を中心点から生やす。
4.楕円のゆがみ率の最大値を決定する。全ての点が楕円内に収まるまで。

もう少し具体的に言うと、
・中心点と長軸線を決定する。
・中心点を(0,0)とした座標系に平行移動する。
・長軸線をX軸とする座標系に回転移動する。
・長軸の長さをRとし、4n個の点を新座標系の極座標で表す。
・楕円のゆがみ率をW=短軸/長軸で定義すると、楕円の方程式は(R*CosT,W*R*SinT)。
・最初Wを最小値W=0と置き、4n個の点の極座標(R*CosT,Wi*R*SinT)から求められるWiと比較する。
・Wiの最大値が求めるべきゆがみ率なのでそれをWMと書けば、楕円の方程式は(R*CosT,WM*R*SinT)。
・後は座標系を戻して行って、VBの世界での楕円の方程式が完成。

投稿時間:2004/12/15(Wed) 10:28
投稿者名:ダンボ
URL :
タイトル:
楕円でなく滑らかな曲線で囲む場合(完成)
ボタンn個に対して4n個の点の「一番外側」の点を決めてベジェ曲線で繋ぐと言うのも1方法です。

基本方針:中心点を求めて、原点移動・極座標化までは他と同じ。
注目する1個のボタンの4端点のうち、中心点からの距離が一番遠いものをそのボタンの描画点とする。

具体的方法:
・中心点を、(4n個のX座標の単純平均、4n個のY座標の単純平均)とする。
・中心点を(0,0)とした座標系に平行移動する。
・各ボタンiに付き、4個の点を新座標系の極座標で表す。(R,T)=(root(X*X+Y*Y),arccos(X,R))
・各ボタンiに付き、Rが最大の点の座標を記録する。
・後は座標系を戻して行って、n個の端点をベジェ曲線で繋ぐ。