オンライン画像枠線追加

枠線追加の仕組み

枠線の追加は、写真の上にかけるフィルターではなく、キャンバス上で直接行われます。元の画像をメモリ上のHTMLキャンバスに読み込み、幅と高さの両方を枠線の幅の値のちょうど2倍（各辺に1回分ずつ）だけ大きくします。そのあと、外側の縁に沿って枠線の色で長方形のフレームを描き、最後に元の画像を解像度そのまま、内容を一切変えずに、新しく生まれた余白の中央に描画します。写真自体のピクセルには何も手を加えず、このツールは上に塗ったり再サンプリングしたりするのではなく、周囲に素材を足すだけです。 実線スタイルは、枠線の幅いっぱいを使って1本の連続したストロークを描きます。二重線スタイルは同じ幅をおおよそ3等分し、外側のリング、隙間、内側のリングに分け、両方のリングに同じ枠線の色を使うことで、2本の線の間にわずかな空白がのぞく、額装写真のような古典的な見た目になります。この3つの区分にはそれぞれ最低でも1ピクセルが必要なため、二重線の効果がはっきり2本の線として見えるのは、幅がある程度、おおよそ15px以上のときです。それより小さい幅では区分が押しつぶされ、1本の太いストロークのように見えてしまいます。 枠線は特定の意味で均一です。1つの枠線の幅の値が4辺すべてに同時に適用され、写真自体の形にかかわらず、角は常に直角のままです。このツールは角を丸めず、辺ごとに幅を変えるコントロールも、非対称なマットを作る機能もありません。出力は元ファイルの種類を保ちます。JPEGに枠線を加えるとJPEGのままで、PNGに加えるとPNGのままです。これは二重線スタイルの隙間にとって重要な意味を持ちます。その隙間はどんな色でも塗りつぶされないため、PNGでは透明として描画され、アルファチャンネルを持たないJPEGでは単色の黒として描画されます。