テーブル生成 APIJSON からテーブルを。レイアウトは自動です。
価格表、請求書、ランキング、レポート。行を JSON で送れば、画像や PDF の中にきれいなテーブルが入ります。
sales-table
{
"columns": ["Region", "Orders", "Revenue"],
"rows": [
{
"Region": "North America",
"Orders": 120,
"Revenue": "$45k"
},
{ "Region": "EMEA", "Orders": 96, "Revenue": "$38k" },
{ "Region": "APAC", "Orders": 142, "Revenue": "$51k" },
{ "Region": "LATAM", "Orders": 58, "Revenue": "$19k" }
]
}| Region | Orders | Revenue |
|---|---|---|
| North America | 120 | $45k |
| EMEA | 96 | $38k |
| APAC | 142 | $51k |
| LATAM | 58 | $19k |
| Total | 416 | $153k |
使い方
- 01
テーブルレイヤーを追加
テンプレートにテーブルを置き、ヘッダー、ストライプ、行の高さ、フッターのスタイルを整えます。
- 02
列と行を送る
キーが列と一致するレコードの配列を渡します。レイアウトに収まる分だけ、何行でも送れます。
- 03
ファイルを生成
デザインしたテーブルに行データが収まった、画像または PDF が返ります。
機能
データを入れれば、テーブルが出てくる。
HTML テーブルも、レイアウトの計算も、スプレッドシートのスクリーンショットも要りません。
あなたのデザイン、あなたのデータ
バリアント、ストライプ、行の高さ、フッターは設定したままです。変わるのは中身だけです。
画像にも PDF にも
同じテーブルを、SNS 用の画像にも、請求書の PDF にも、印刷用の価格表にも使えます。
シンプルな JSON
列は名前の配列、行はその名前をキーにしたレコードです。ほかに覚えることはありません。
詳しく見る（シンプルな JSON）
curl -X POST https://api.bannerify.co/v1/templates/createImage \
-H "Content-Type: application/json" \
-d '{
"apiKey": "bnfy_xxx",
"templateId": "tpl_catalog",
"modifications": [
{
"name": "sales-table",
"columns": ["Region", "Orders", "Revenue"],
"rows": [
{
"Region": "North America",
"Orders": 120,
"Revenue": "$45k"
},
{ "Region": "EMEA", "Orders": 96, "Revenue": "$38k" },
{ "Region": "APAC", "Orders": 142, "Revenue": "$51k" },
{ "Region": "LATAM", "Orders": 58, "Revenue": "$19k" }
]
}
]
}' --output banner.pngimport { Bannerify } from "bannerify-js"
const bannerify = new Bannerify("bnfy_xxx")
const { result, error } = await bannerify.createImage("tpl_catalog", {
modifications: [
{
name: "sales-table",
columns: ["Region", "Orders", "Revenue"],
rows: [
{
Region: "North America",
Orders: 120,
Revenue: "$45k"
},
{ Region: "EMEA", Orders: 96, Revenue: "$38k" },
{ Region: "APAC", Orders: 142, Revenue: "$51k" },
{ Region: "LATAM", Orders: 58, Revenue: "$19k" }
]
}
],
})from bannerify import BannerifyClient
client = BannerifyClient("bnfy_xxx")
result = client.create_image(
"tpl_catalog",
modifications=[
{
"name": "sales-table",
"columns": ["Region", "Orders", "Revenue"],
"rows": [
{
"Region": "North America",
"Orders": 120,
"Revenue": "$45k"
},
{ "Region": "EMEA", "Orders": 96, "Revenue": "$38k" },
{ "Region": "APAC", "Orders": 142, "Revenue": "$51k" },
{ "Region": "LATAM", "Orders": 58, "Revenue": "$19k" }
]
}
],
)<?php
use Bannerify\Bannerify\BannerifyClient;
$client = new BannerifyClient('bnfy_xxx');
$result = $client->createImage('tpl_catalog', [
'modifications' => [
[
'name' => "sales-table",
'columns' => ["Region", "Orders", "Revenue"],
'rows' => [
[
'Region' => "North America",
'Orders' => 120,
'Revenue' => "$45k"
],
[ 'Region' => "EMEA", 'Orders' => 96, 'Revenue' => "$38k" ],
[ 'Region' => "APAC", 'Orders' => 142, 'Revenue' => "$51k" ],
[ 'Region' => "LATAM", 'Orders' => 58, 'Revenue' => "$19k" ]
]
]
],
]);よくある質問
答えが見つからない場合は、an@bannerify.co までメールでお問い合わせください。創業者が返信します。
新しい行を送ると、スタイルは変わりますか？
いいえ。バリアント、ストライプ、行の高さ、フッターは、エディタで設定したままです。変わるのはデータだけです。
