iPromenade

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　：　ステイタスバーの有無

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

　　

「エンジョイ！ブログ」で自動生成される拡大画面表示用のHTML内のJavascript に問題があるように思います。

         <script type="text/javascript">
            YAHOO.util.Event.onDOMReady( function() {
                var vw = YAHOO.util.Dom.getViewportWidth(),
                      vh = YAHOO.util.Dom.getViewportHeight();
                var img = new Image();
                img.src = "/./photos/uncategorized/2013/05/30/119_3.jpg";
                if ((img.width > 0 ) && (img.height > 0)) {
                    window.resizeBy( img.width - vw, img.height - vh );
                }
            } );
        </script>

画面上部のタイトルバー や アドレスバー、下部のタスクバーの高さ等が考慮されていないように思われます。　これらを加味してwindowのサイズを決定するようにすれば、画像サイズや画面サイズ（解像度）に関係なく画像全体が表示できるようになるはずです。

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

横長の画像は問題ないのですが、縦長の画像を拡大表示したときに画像の下部が一部切れてしまうのです。

エディオンネットの事務局さんに色々とお聞きしたところ、14型程度のPC画面で大きな画像を表示しようとすると発生するとのこと （因みに当方は 15.4型ワイド）。　画像を縮小してUPするか、大型画面のPCを使えば縦長でも問題なく表示できるとのことでした。

　
　写真左：　富士宮市内の村山浅間神社の境内にある碑
　写真右：　富士山西麓の田貫湖の逆さ富士