30 秒概要： このページは Taiwan.md の視覚化システムの「実例」―十七種類の文章内視覚モジュールをすべて一度ずつレンダリングし、すべて実際の台湾データ（住宅価格所得比、国宅、高齢化、国民投票）を使用しています。これは編集ガイドライン graph.md のパートナーです：graph.md は「いつどのモジュールを使うか、どうすればよいか、構文はどう書くか」を説明し、このページは「実際にどのように見えるか」を直接示します。 各モジュールは純粋な HTML／SVG でレンダリングされるため、人間、スクリーンリーダー、Google、AI クローラーすべてが同一のデータを読み取れます――これがインタラクティブなチャートではなく静的視覚化を選んだ理由です。
数字だけの記事を書くとき、最も恐れるのはデータが段落ごとに数字の山になり、読者が三つ目のパーセンテージで頭が真っ白になることです。視覚化の仕事は「密集した数字の prose」をエントロピーを下げて「一目で読める構造」に変換することです。
しかし Taiwan.md の視覚化には他にない規律があります：「LLM（大規模言語モデル）にも読める」視覚化だけを作ります。D3 や Canvas で描くインタラクティブチャートは華やかですが、GPTBot、PerplexityBot、ClaudeBot などの AI クローラーは JavaScript を実行しません。そのため、これらの AI にとっては画像は空白です。一方、semantic HTML とインライン SVG で作った図はデータがソースコードに埋め込まれているため、六つの言語で AI が読み取り、台湾の第一人称データとして引用できます。LLM が読める視覚化こそが主権の視覚化です。
以下の十七モジュールは、最もシンプルな「大きな数字」から「県市タイルマップ」まで順に示します。構文と設計原則の完全版は graph.md にありますが、ここでは「何か」「いつ使うか」だけを記載します。
データ大数字 tw-figure
最もシンプルで力強い方法：劇的な数字を最大サイズで表示し、前後の比較で変化を語ります。導入部の「sledgehammer stat」に最適です。
データ集合 tw-stat
段落に三四個の重要数字が並んでいるとき、長文にするよりカード列に並べて読者が一目で把握できるようにします。
対比カード tw-versus
二つの制度・立場、または前後の状態を点ごとに比較します。左は暖色、右は寒色、中央に「vs」を置き、差異を行単位で読ませます。
比例バー tw-bars
少数カテゴリの数値比較や順位付けに適します。水平バーの長さは数値に応じて自動スケーリングされ、最大値が幅いっぱいになります。データモジュールの最後に 來源： 行を入れると、下部に自動で出典が表示されます。
資料來源：内政部不動産情報プラットフォーム、政大不動産研究センター
ワッフル図 tw-waffle
部分が全体に占める割合を示す図で、100 マスが 100% を表し、円グラフより直感的です――実際にマスを数えることができます。合計がほぼ 100% になるデータに適しています。
資料來源：ウィーン市政府（Stadt Wien）住宅統計
政策軸 tw-timeline
制度や政策の重要な節目を時間軸でつなげます。これは「視覚的補助」であり、本文の小見出しとして年代順に並べる年表とは別物です。
引用カード tw-quote
記事全体の核心的な主張を一文で表すときに使用します。引用文はモジュールが自動で引用符を付与します。引用は逐語的で検証可能である必要があります。
市価 3000 万元の住宅が、6000 から 7000 万元に変わる……貧者を犠牲にして富者を救う、国家が金銭を出して裕福層の住宅改修を支援する
出典チップ tw-source
分析の出典を一つの目立たないチップとして段落横に配置します。信頼性はキュレーションの一部であり、台湾のデジタルメディアは出典表示を忘れがちです。ここで差別化できます。
内政部不動産情報プラットフォーム、実価登録、政大不動産研究センター、立法院公報、香港住宅委員会
説明ボックス tw-note
データ記事の信頼性の半分は「計算方法」にあります。記者はデータジャーナリズムで【説明】ブロックを使い計算手順や訂正を示します。この合意をモジュール化したものです。最初の行に 說明、方法、註、更正、更新 のいずれかを書き、残りの行はそれぞれ独立した段落とします。
折れ線図 tw-line
四点以上の時間系列のトレンドをインライン SVG の折れ線で描き、y 軸の上下限も表示します。最も重要なのは隠れたデータテーブルが自動生成されることです。スクリーンリーダーや AI クローラーはこのテーブルから元データを取得できます。図は人が見るため、表は機械が読むため、両者は同一ソースです。
| 年 | 全国 |
|---|---|
| 2014 | 8.41 |
| 2016 | 9.32 |
| 2018 | 8.57 |
| 2020 | 9.2 |
| 2022 | 9.61 |
| 2024 | 10.76 |
資料來源：政大不動産研究センター、内政部不動産情報プラットフォーム
折れ線図は基準線もサポートします：基準：ラベル | 値 を追加すると、点線で表示され、端点はなくラベルだけが描かれます。読者が固定の閾値と測定データを混同しないようにします。
勾配図 tw-slope
「二つの時間点」だけの場合、折れ線図は余白が多くなります。勾配図は両端を直線で結び、傾きで比較します。どちらが急上昇したか、どちらが追い抜いたかを一目で判断できます。行頭に * を付けると特定の行を強調し、他は薄く表示されます。
| 2014 | 2024 | |
|---|---|---|
| 全国 | 8.41 | 10.76 |
| 台北 | 12.0 | 16.60 |
資料來源：内政部不動産情報プラットフォーム、政大不動産研究センター
ヒートマップ tw-heatmap
地域×指標、または年×カテゴリのマトリクス比較です。各列は正規化され、色の濃さで数値の大きさを示します。数値が大きいほど暖色になります。HTML テーブルとして実装されているため、AI が直接読み取れます――これが画像だけのヒートマップより優れている点です。
| 県市 | 住宅価格所得比（倍） | 住宅ローン負担率（%） |
|---|---|---|
| 台北 | 16.60 | 63.9 |
| 新北 | 13.03 | 56.9 |
| 台中 | 11.11 | 48.0 |
| 桃園 | 9.0 | 40.0 |
資料來源：内政部不動産情報プラットフォーム
点図 tw-dot
棒グラフが「量」を示すのに対し、点図は「分布」を示します。すべての点が同じ尺に配置され、どの地域が密集しているか、外れ値がどこかが一目で分かります。各行に一つの値を入れるとドットストリップが生成され、二つの値を入れると「ここからそこまで」の区間が描かれます。* で強調可能です。
資料來源：内政部戸政司、2025 年末
スタックバー tw-stack
ワッフル図が「全体の構成」を示すのに対し、スタックバーは複数行にわたる構成比較に適します――各行は自動で 100% に正規化され、幅が十分あれば数値が色ブロック内に直接表示されます。
| 公投 | 賛成 | 反対 |
|---|---|---|
| 2018 年の核エネルギー維持 | 59 | 41 |
| 2021 年の核四再稼働 | 47 | 53 |
| 2025 年の核三延長 | 74 | 26 |
資料來源：中央選挙委員会三つの公投公式審定結果
ピラミッド tw-pyramid
左右が対称の棒グラフで、中央に共通ラベルがあります。人口学の古典的な図形です。ここでは六つの県市の「頭重脚軽」を示します：左が子ども人口、右が高齢者人口。両側を比較することで、高齢化が単なるパーセンテージ以上の意味を持つことが分かります。
資料來源：内政部戸政司 2025 年末；幼年比率は高齢化率 ÷ 老化指数 × 100 で算出
県市タイル図 tw-tiles
台湾の choropleth 地図は二つの問題があります：花蓮・台東の面積が大きく視覚的重みを奪うこと、AI が手描きの台湾形状を「オリーブとジャガイモの間」と誤認することです。タイル図は 22 県市を等サイズのタイルに配置し（レイアウトはシステム内で固定）、各タイルは同じ重みで数字が直接書かれます。形は常に正しく、地形を描く必要がありません。
資料來源：内政部戸政司、2025 年末
単位図 tw-iso
「174,891 戸」という数字は一度読んだだけでは忘れがちです。九つの指で数えられる円点に置き換えると、感覚的に把握しやすくなります。単位図は「一つのシンボル＝いくら」という可算単位に変換し、記者が遠洋漁業特集で用いた手法です。シンボルは整数のみ使用し、正確な値は横に記載します。
● ≈ 1
資料來源：行政院 国民住宅条例廃止ニュースリリース
これらのモジュールの使い方
各モジュールは記事の Markdown 内で ```tw-* ブロックを書くだけで利用できます。| で列を区切り、ビルド時に上記のような表示に自動変換されます――作者は HTML や JavaScript を書く必要はありません。完全な構文、使用タイミング、色彩や座標軸の設計指針、公開前の視覚化チェックリストはすべて graph.md に記載されています。
このシステムは視覚的ストーリーテリングメディア The Pudding の編集哲学を参考にしています――「問題はデータより先にある」「結論は明確に」「注釈が主役」――しかし Taiwan.md 独自の要素として、静的・多言語・AI 可読 を実現しました。設計の全体像は 視覚化システム設計報告 に記載されています。
実際の深掘り記事でこれらのモジュールがどのように組み込まれているかを見たい方は、国宅と居住正義 をご覧ください――本ページのデータは主にその研究から取得しています。
延伸閱讀：
- 國宅與居住正義 — これらの居住データの背後にある完全なストーリー：国宅が安価な住宅から資産階段へと変化した過程と、本ページの多くのモジュールのデータ出典
- 用數據看台灣22縣市 — 本ページの点図、ピラミッド、県市タイル図の高齢化データはすべてこの 22 県市分析から取得
- 台灣與核能的討論 — スタックバーの三つの公投の完全なストーリー：議論に勝ち、制度に負けた経緯
- 社會住宅與居住正義 — 2016 年以降の「賃貸のみ」路線の詳細
- 台灣少子化危機 — 住宅が買えず子どもが産めない、世代正義の別側面
参考資料
画像出典
本稿は CC BY-SA 4.0 ライセンスの画像を 1 枚使用し、public/article-images/society/ にキャッシュしています：
- 台北市住宅スカイライン（象山ビュー） — Photo: Heeheemalu, 2026, CC BY-SA 4.0（ヒーロー画像）