軽く前回の説明を。
私自身JSONなるものをほとんど理解していないのですが、XMLとほとんど同じだと思っています。階層構造で管理できる便利なものくらいの認識です。
HTMLがXMLみたいなもんで、XMLがJSONみたいなもんで、
つまりはJSONはHTMLみたいなもんなんです。
このJSONを書いてる時、頭は下記HTMLを書いているイメージでした。
<div style="border: 1px black solid; ・・・略">
<div style="padding: 5px">
<div>
<span style="padding-right: 10px">
【対戦日】
</span>
<span>
【対戦相手】 + "@" + 【球場】
</span>
</div>
<div>
<span>
【中日スコア】 + " vs " + 【相手スコア】
</span>
</div>
<div>
<span>
"勝ち投手:" + 【勝ち投手】 + " 負け投手:" + 【負け投手】 + " セーブ:" + 【セーブ】
</span>
</div>
</div>
</div>
※【】内は列名
HTMLのイメージができたらあとは文法に倣って書いていくだけ。
- elmType ⇒要素の指定
- style ⇒style属性の指定
- children ⇒子要素の指定
- txtContent ⇒要素に対するテキストの指定
んで、一部特殊なものがあって「operator」と「operands」
operatorは演算子の指定。「+」だと文字列の結合になる。数値同士だと加算されるんかな。他にも「?」だと条件演算子になったりする。下記ページ下の方にあり。
operandsはoperatorで指定された演算子の引数みたいなもの。
operatorが「+」だったら A + B + Cみたいな。それをカンマ区切りで列挙していけばよい。
12行目のbackground-colorのワチャワチャについては条件分岐。=if()のようにExcelスタイルで条件分岐での指定が可能。(「Excelスタイル」って一般的に使われてる言葉なの?)
=if(論理式, 真の場合, 偽の場合)
これを入れ子にして書いているだけ。
わー簡単だー。
参考:https://docs.microsoft.com/ja-jp/sharepoint/dev/declarative-customization/column-formatting