iPromenade

デジカメで撮った写真を風景画風に変換　・・・　その４。

今回は前回までとは異なる方法でトライしてみました。

オリジナル写真はそれぞれ次のとおり。

デジカメで撮った写真を風景画風に変換　・・・　その３。

前回までは白黒でしたが、今回は元画像の色を反映したものにしてみました。

上から順番に、
　湧永庭園（安芸高田市）、広島ビッグアーチ、
　同競技場内、長門峡（山口市）、
　高千穂峡（宮崎県高千穂町）、数鹿流ケ滝（すがるがたき、日本の滝100選、　熊本県南阿蘇村）、
　赤間神宮（下関市）、道の駅 酒谷(日南市)

2枚の写真を種々の方法でミックスした画像を作成するアプリです。

「合成写真（選択的重ね合わせ）」として数回紹介した写真の作成に使用した自前のアプリです。　時々不安定な動作をすることがありますが・・・。

格子状に交互に配置したり、任意の形状の小窓（バブル）にもう一方の写真を配置したりといったことができます。

　画像の選択的重ね合わせアプリは　－＞ こちら

（例）
　元の２枚の写真  （広島ビッグアーチ）

 合成写真

デジカメで撮った写真を風景画風に変換　・・・　その２。

最近の広島ビッグアーチ（エディオンスタジアム広島）の様子です。

2枚のオリジナル写真A、Bについて、場所毎にどちらかの画像を選択して合成した写真 その５。

今回は前回と同様に、任意の場所に小窓をあけて、そこに写真Bを表示するとともに、他の写真Cの任意の部分を切り取ってこれに重ね合わせてみました。

●オリジナル写真
　　A（左）：　帝釈峡（庄原市）
　　B（右）：　原爆ドーム
　　C（下）：　湧永庭園(安芸高田市）

●合成写真
　A+Bの合成写真に、Cの部分画像が4か所挿入されています。

2枚のオリジナル写真A、Bについて、場所毎にどちらかの画像を選択して合成した写真 その４。

今回は前回と同様に、任意の場所に種々の形状で小窓をあけて、そこに写真Bを表示する方法の続きです。

●オリジナル写真
　　A（左）：　知覧武家屋敷庭園（南九州市）
　　B(右)：　阿蘇山火口

●合成写真

2枚のオリジナル写真A、Bについて、場所毎にどちらかの画像を選択して合成した写真 その３。

今回は任意の場所に種々の形状で小窓をあけて、そこに写真Bを表示する方法です。

●オリジナル写真
　　A（左）：　知覧武家屋敷庭園（南九州市）
　　B(右)：　阿蘇山火口

●合成写真

2枚のオリジナル写真A、Bについて、場所毎にどちらかの画像を選択して合成した写真 その２。

今回は正方格子状、斜め格子状、同心円状、同心格子状に領域を分割して、交互にA,Bを表示する方法です。　合成写真の外周にはぼかしを入れています。

● オリジナル写真
　　A（左）:　吾妻山（広島県庄原市）大池
　　B（右）：　湧永庭園（広島県安芸高田市）

● 合成写真

複数（最大4枚）の写真を互いが少し重なるようにして合成するアプリです。

重なる部分は一方の画像から徐々に隣りの画像に変化します。

また周辺を徐々にぼかし、４隅には丸みを付けることもできます。

　画像の部分重ね合わせアプリは　－＞　こちら

（例）　オリジナル写真（4枚） と 重ね合わせ写真

エディオングループのISPであるエディオンネットの「エンジョイ！ブログ」を使用していますが、Blog記事内の縦長画像をクリックして拡大画像を表示したときに画像の下部が一部切れてしまうことがあります。

この問題を解決するには 「エンジョイ！ブログ」で自動生成される拡大画面表示用のHTML内のJavascript で、画面上部のタイトルバー、アドレスﾊﾞｰ や下部のタスクバーの高さ等を考慮してwindowのサイズを決定するように改良して頂くのが最善ですが、ここでは Blog記事をHTML編集モードにして一部変更する方法を紹介します。

Blog記事をHTML編集モードで表示すると、次のようになります（画像の部分）。

<a onclick="window.open(this.href, '_blank', 'width=600,height=800,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"
href="http://k-ichikawa.blog.enjoy.jp/.shared/image.html?/photos/uncategorized/2013/05/30/119_2.jpg"><img width="200" height="266" title="119_2" alt="119_2"
src="http://k-ichikawa.blog.enjoy.jp/blog/images/2013/05/30/119_2.jpg" border="0" /></a>

ここで、scrollbars=no を scrollbars=yes に変更して保存すると、拡大表示画面でスクロールバーが表示され、これをドラッグすると切れた（隠れた）部分を表示できます。

従来の画像　（scrollbars=no）
　

編集した画像　（scrollbars=yes）
　

（参考）　window.open() の主なパラメータの意味は下記のとおり。

　this.href　：　href 属性で指定されたURLを表示
　_blank　：　新規ウィンドウ
　width　：　ウィンドウの幅
　height　：　ウィンドウの高さ
　scrollbars　：　スクロールバーの有無
　resizable　：　ウィンドウサイズのリサイズ可否
　toolbar　：　ツールバーの有無
　location　：　アドレスバーの有無
　menubar　：　メニューバーの有無
　status　：　ステイタスバーの有無