CGIの表示を変える

質問

CGIなどで既に表示されている画像を何らかのアクションで180度回転させる方法はあるのでしょうか？。

回答No.3

leap_day · ベストアンサー

こんにちは

思いつく方法は5つかな？（まだあるかもしれないけど（－－；）
画像反転は『画像反転　ソフト』などで検索すると希望のが見つかるかもしれません

【1】ImageMagickを使ってページ更新させて表示させる
http://katsubemakito.net/cgiperl/image/imagemagick/post-26.html

これは『画像反転　cgi』で検索したらHitしたものなので詳しい利用法など分からないです
概略としてはformにkeyなどをつけてページを更新してif文で表示させるようにすればよいかと思います

【2】反転画像(***(反転).gif)を別に用意してif文を使って画像表示を描き分ける
if($in{'mode'} eq "反転") {
print "<img src='***(反転).gif'>\n";
}else {
print "<img src='***.gif'>\n";
}
print <<"EOM";
<form action="○○.cgi" method="post">
<input type="hidden" name="mode" value="正転">
<input type="submit" value="正転画像">
</form>
<form action="○○.cgi" method="post">
<input type="hidden" name="mode" value="反転">
<input type="submit" value="反転画像">
</form>
EOM

【3】javascriptでstyle="filter:fliph()"、style="filter:flipv()"を変更して反転させる

<script language="javascript">
<!--
function change(n) {
obj = document.getElementById("img").style.filter = n;
}
//-->
</script>
<img src="***.gif" id="img">
<input type="button" value="正転" onclick="change('fliph()')">
<input type="button" value="反転" onclick="change('flipv()')">

ですがこれはIE専用となります

【4】javascriptでdisplay:none;block;を使う
反転画像(***(反転).gif)を別に用意して

<script language="javascript">
<!--
function change(m,n) {
document.getElementById(""+m+"").style.display = "block";
document.getElementById(""+n+"").style.display = "none";
}
//-->
</script>
<img src="***.gif" id="img0">
<img src="***(反転).gif" id="img1" style="display:none;">
<div style="clear:both;"></div>
<input type="button" value="正転" onclick="change('img0','img1')">
<input type="button" value="反転" onclick="change('img1','img0')">

【5】javascriptを使って画像を差し替える
これも反転画像(***(反転).gif)を用意しておいて

<script languge="javascript">
<!--
function change(n) {
document.getElementById("img").src = n;
}
//-->
</script>
<img src="***.gif" id="img">
<input type="button" value="正転" onClick="change('***.gif')">
<input type="button" value="反転" onClick="change('***(反転).gif')">

お礼

leap_dayさん
danmarinoさん
お二人ともありがとうございます。
今回はじめて聞くimageMagickを試してみます。

回答No.2

danmarino

ImageMagickでできます

お礼

leap_dayさん
danmarinoさん
お二人ともありがとうございます。
今回はじめて聞くimageMagickを試してみます。

回答No.1

神崎 渉瑠（@taloo）

<a href="180度回転画像のURI">回転画像を表示するにはここをクリック</a>

お礼

回答ありがとうございます。
申し訳ありません、書き方が悪かったです。
例えば、犬の写真がホームページに張ってあり、「180度回転」というボタンを押して画面が更新された時に、その犬の写真が180度回転表示されている状態にするにはどうしたらよいのでしょうか？。