- ベストアンサー
外にある中心で画像を回転させる方法
こんにちは。 現在サイトを作成していまして、その中で画像を回転させたいと思っています。 その画像の中にある中心ではなく、画像の外にある中心で回転させ、画像自体は回転させないようにするのに参考になるスクリプトはありますか？ 私のイメージに近いものとしてはこれです。 http://www.3tomo.net/ 猫の画像が回転しています。
- kunisada
- お礼率52% (111/210)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
何故だれも答えないんでしょう・・ 不思議・・ スミマセン。すごく簡単なサンプルです。 <style> #goo { position:absolute; top:0px; left:0px; visibility:hidden } </style> <script> x=200; //中心座標x px y=200; //中心座標y px r=100 //半径 px int=10 //更新間隔ミリ秒 t=0 function circle(){ t+=10; document.getElementById("goo").style.left=r*Math.cos(t/180*Math.PI)+x; document.getElementById("goo").style.top=r*Math.sin(t/180*Math.PI)+y; document.getElementById("goo").style.visibility="visible" } window.onload=function(){ setInterval("circle()",int); } </script> <body> <img id="goo" src="http://oshiete1.goo.ne.jp/images_goo/goo.gif" /> </body> .
関連するQ&A
- 画像の回転（角度）
こんにちは。 画像の角度の回転方法が分らず困っています。 今、マウスのカーソル周りを三つの画像が周る スクリプトを作ろうとしています。 それで、画像がマウスの周りを回る時に角度を 変えつつ回転させたいのです。 たとえば、↓ こういった矢印画像があったと すると、つねにカーソルの中心を指した状態で カーソルの周りを回るようにしたいです。 マウスの周りを回転するというのはサンプルで いくつか出てきたのですが、画像自体の回転の 方法は見つけられませんでした。 出来れば、両方のサンプルコードのあるサイト か、実際のコードを書いて頂けると助かります。 宜しくお願いします。
- ベストアンサー
- JavaScript
- 携帯アプリで任意の軸を中心に回転させる方法は？
Graphics g = getGraphics(); g.setOrigin(120,120); g.drawImage("イメージファイル","2次元アフィン"); "イメージファイル"はオフスクリーンで作成されたデータです。 こちらの方法を使用いたしますと、 g.setOriginで指定された軸を中心に画像が回転してしまいます。 画面中心を軸として画面全体が回転する方法が見つかりません。 ご存知の方、お教え下さい。
- ベストアンサー
- その他（プログラミング・開発）
- 画像にテキストを埋め込むジェネレーターの作成方法
http://www.web20badges.com/ 上記URLのサイトのように自分で用意した画像に WEB上でテキストを加工（色やサイズ・ボールドや回転等）して 画像を作成するジェネレーターを作成したいと思いますが 参考になるようなサイトやスクリプトなどありましたら 教えていただきたいと思います。 宜しくお願いいたします。
- ベストアンサー
- PHP
- DirectXを使ってテクスチャ(画像)を回転させる
画像を回転させたいのです。 中心を軸として回転させたいのです。(Z軸を軸にして) x=半径*cosθ y=半径*sinθ という式を利用してみたところ、中心を軸としてではなく 画像の外を軸として回転してしまいました 根本的に利用する式が間違っているようですが、 もしかしたら、この式でもできないですか…？
- ベストアンサー
- C・C++・C#
- 商品回転画像の作成方法
ネットショッピングなどでよく見る商品回転画像の作成をしたいのです。 被写体を回転させながら写真にとって8枚用意しました。 JavaScriptで回転してみせる方法を以前雑誌で見た気がするのですが見つけられませんでした。 (フラッシュでもできると思うのですが・・) どちらでも結構です どなたかご伝授ください。よろしくお願い致します。
- ベストアンサー
- JavaScript
- 渦の中心に集まるのはなぜ?
安いお茶を飲んでるもので，細かい葉っぱが湯飲みの底に溜まります．湯飲みをゆすってお茶を回転させると，その葉っぱが渦の中心に集まるのですが……なぜ外側じゃなくて中心なんでしょう? お湯自体は遠心力で外側が上がり中心が下がりますよね?では，なぜお湯に沈む(=お湯より重い)お茶っ葉は外側に行かないのでしょうか? 巻き上げられた時に中心に吸い込まれそうだというのは感覚的には分かるのですが，理由が分かりません．また，その時，中心から外に向かうお湯の流れがあると思うのですが，なぜ葉っぱがその流れに乗って外に行かないのかも分かりません． よろしくお願いいたします．
- ベストアンサー
- 物理学
- 画像を回転させる方法
質問させてください。 今、下記のような画像をドラッグとホイールで360度回転させる機能 http://coliss.com/articles/build-websites/operation/javascript/jquery-plugin-reel.html に、更にスライダー機能（http://zack.dtiblog.com/blog-entry-15.html）も使える様にしたいのですが、参考サイトも見つからず、うまい事組み合わせようとしても実装できません。 もしわかる方いらっしゃいましたら教えて頂ければと思います。 何卒宜しくお願い致します。
- 締切済み
- JavaScript
- Androidアプリ開発 画像の回転について
CANVASに画像を表示し、その画像を回転させるようにしたいのですが、どうにもうまくいかなくて困っています。 画像の中心を軸に回転させたいと思って以下のように実装してみたのですが、うまくいきません。 //////////////////////////////以下抜粋//////////////////////////////// Matrix matrix; // Bitmap のサイズの取得 int width = bmp.getWidth(); int height = bmp.getHeight(); matrix = new Matrix(); // 画像の中心を軸に回転させるようにする（ここがうまくいっていないっぽい・・・） matrix.postRotate(5.0ｆ, width / 2.0f, height / 2.0f); // 回転させた画像を生成する bmp2 = Bitmap.createBitmap(bmp, 0, 0, width, height, matrix, true); // CANVASに画像を描画する canvas.drawBitmap(bmp2 , 10.0ｆ, 10.0ｆ, paint); ////////////////////////////////////////////////////////////////////// 上記のコードで画像自体は回転するのですが、中心軸がずれてしまっているようです。 画像のサイズは横１５ピクセル、縦１５ピクセルとなっております。 また、matrix.postRotateの前でmatrix.postTranslate()にて軸を設定してみたのですが、 これもうまくいきませんでした。 きれいに画像を回転させるにはどのようにすればよいか、わかる方いましたら教えて いただけないでしょうか？
- ベストアンサー
- Java
- 画像を垂直回転させながら移動させるには？
こんにちは。勘違いで他の分類で質問をしてしまったのでもう一度質問させていただきます。 ある画像が垂直に回転しながら（例えばコインが表と裏が交互に見える状態）画面の左上からカーブを描いて中心に移動するようにしたいです。ちなみにmacでflashのcs3です。 私はflashの初心者なため、アクションスクリプトもよくわかりません。 教えていただけるとありがたいです。よろしくお願いいたします。
- ベストアンサー
- Flash
- PlgBltで画像の回転
WINAPI:PlgBltにてビットマップ画像を回転させるソフトを作成中ですが、 画像サイズが大きくなると(5000x5000Pixel)、関数の戻り値自体は成功しているのですが、結果ビットマップ画像を見てみると真っ黒になってしまい、うまくいきません。 原因と対策方法を教えて下さい。 ちなみに、画像サイズが小さいと(100x100Pixel)うまくいきます。 尚、 OS:XP SP2 開発環境：Visial Stadio6.0 です。
- 締切済み
- その他（プログラミング・開発）
お礼
回答ありがとうございました。 まさに私が求めていた内容です。