画像に枠線やフレームを追加する方法

画像をBase64形式で入力し、枠線の色と幅を指定すると、成功時に枠線付き画像をBase64形式で受け取れます。幅の標準値は10、色の標準値は#000000です。

画像に枠線を追加する前に

画像の周囲に枠線やフレームを加えたいときは、画像データをBase64形式の文字列として用意し、色と幅を指定して処理します。画像そのものを入力するのではなく、画像を表す文字列を渡す点が重要です。サムネイルの境界を見やすくしたい場合や、複数の画像に同じ色の枠を付けたい場合に使えます。

色と幅を省略して標準設定を使うことも、用途に合わせて変更することもできます。処理が成功すると、枠線が付いた画像をBase64形式の文字列で受け取れます。元の画像と処理後の画像の寸法も返されるため、加工後のデータを保存したり、表示前にサイズを確認したりできます。

画像に枠線を追加する手順

1. 枠線を付ける画像をBase64形式の文字列に変換します。入力欄には、その画像を表す文字列を指定してください。入力を空のままにすると処理に失敗します。
2. 枠線の幅を指定します。幅を入力しない場合は10が使われます。幅を入力した場合、その値が枠線処理に渡されるため、目的に応じた値を設定してください。
3. 枠線の色を指定します。色を省略した場合は#000000です。色は6桁の16進数で指定します。先頭に#を付けた場合も、処理時にはその記号が取り除かれます。
4. 指定内容を確認して処理を実行します。入力画像が有効に処理されると、枠線付き画像のBase64文字列と、元画像および処理後の画像の寸法が返されます。
5. 返されたBase64文字列を画像データとして扱い、必要な場所に保存または表示します。保存形式は元の形式を利用できる場合はその形式になり、利用できない場合はPNGになります。

処理結果の見方

成功した結果では、加工済み画像を表すBase64文字列を確認します。この文字列は入力に使った画像ではなく、枠線が追加された画像のデータです。返された寸法を元画像の寸法と見比べると、処理前後のサイズを把握できます。記事や画面に表示するときは、返されたデータを画像として扱い、保存形式にも注意してください。

色は6桁の16進数を赤・緑・青の成分として解釈します。たとえば、#000000は標準の黒色指定です。#の有無ではなく、6桁の色指定として内容を整えてから入力すると確認しやすくなります。幅を省略した結果を使う場合は10、変更した場合は入力した値が処理に渡されたことを前提に結果を確認します。

使用例

旅行写真の周囲に標準設定の黒い枠線を追加し、加工後の画像を受け取りたい場合です。

旅行写真をBase64形式の文字列にし、色を#000000、幅を10として処理します。返されたBase64文字列を画像データとして扱い、元画像と処理後の寸法、保存形式を確認します。

成功すると、枠線付き画像のBase64文字列と、元画像および処理後の画像の寸法が返ります。元の形式を利用できない場合は、出力形式がPNGになります。

制限事項

• 入力が空の場合は処理に失敗します。枠線付き画像と寸法が返るのは、処理が成功した場合です。

よくある間違い

• 入力欄を空のまま実行すると処理に失敗します。対象画像をBase64形式の文字列にしてから、入力値として指定してください。

よくある質問

画像を指定しなくても枠線を追加できますか？

空の入力では処理に失敗します。枠線を付けたい画像をBase64形式の文字列にして指定してください。

枠線の幅を省略するとどうなりますか？

幅を省略した場合は10が使われます。幅を指定した場合は、その入力値が枠線処理に渡されます。

枠線の色はどのように指定しますか？

6桁の16進数で指定します。先頭の#は処理時に取り除かれ、残りの6桁が赤・緑・青の成分として解釈されます。