ロールオーバー時にいくつかの描画をトリガーする HTML5 イメージ マップに変換しているいくつかの単純なフラッシュ アニメーションがあります<area>
。
問題は、すべての円 (ロールオーバー ポイントを表す) がフラッシュ サークル オブジェクト座標として与えられることです。問題の点は、円の一番上と一番左の点 (下の画像の赤い破線でマーク) から延びる仮想線の結合点で形成されます。
しかし、HTML5 で (現在 raphael.js を使用して) 円を描画するには、中心座標を指定する必要がありますvar c = paper.circle(x, y, radius)
。
たとえば、高さと幅が 19.80 のフラッシュ サークル オブジェクト (532.20,30.35) がある場合 (これも仮想線が交差する点から)、中心点に円を描くために必要な値を計算するにはどうすればよいですか?キャンバスに?