Version: v1.0.6 | Last Updated: 2026-01-29
Cities Skylines風の戦略性を備えたブラウザ型都市建設シミュレーターです。 初期資金250,000円で都市を発展させ、人口、資金、快適度のバランスを取りながら経営を続けます。 タッチ対応で、デスクトップ・スマートフォン・タブレットで遊べます。
🎮 Play Online - Easy Cities 2D
- 都市建設: 道路、住宅、商業、工業、インフラを配置して都市を発展させます
- 経済システム: 初期資金250,000円で開始し、税収と維持費で経営します
- 人口管理: 建物の自動成長で人口が増加、段階的にレベルアップします
- 快適度システム: 複数の要因で都市の住みやすさを測定
- ゲーム設定: 難易度選択、災害・公害・スラム化システムのON/OFF選択
- タッチ対応: マウス・タッチ両対応で、スマートフォンでもプレイ可能
| 項目 | 説明 |
|---|---|
| 人口 | 各建物のレベルに応じた人口が増加 |
| 資金 | 建設コスト、税収、維持費で変動 |
| 快適度 | 緑地率、交通充実度、汚染度などで計算 |
| 月 | 経過時間（月次更新は月額コスト計算） |
- 道路 (200円/タイル): 建物の成長を促進
- 駅 (5,000円): 周辺の発展を加速（1.5倍）
- 公園 (1,000円): 快適度向上用
- 警察署 (8,000円): 治安向上
- 消防署 (7,000円): 安全性向上
- 病院 (10,000円): 医療サービス
- 学校 (6,000円): 教育サービス
- 発電所 (15,000円): 電力供給
- 水処理施設 (12,000円): 水道管理
- 住宅地 (L1-L4): 自動成長、人口増加
- 商業地 (L1-L4): 自動成長、雇用と収入
- 工業地 (L1-L4): 自動成長、雇用（汚染注意）
- スタジアム (50,000円): 観光収入
- 空港 (80,000円): 航空収入
- 削除: 不要な建物を除去
| レベル | 人口 | 月額税収 | 説明 |
|---|---|---|---|
| L1 | 10人 | 20円 | 低層住宅 |
| L2 | 50人 | 60円 | 中層住宅 |
| L3 | 200人 | 150円 | 高層住宅 |
| L4 | 500人 | 300円 | 超高層ビル |
- 1024x1024ピクセル: 高解像度で都市を表示
- リアルタイム成長: 配置した道路や駅の周辺から建物が自動成長
- カラーコーディング: 建物タイプに応じて色分け表示
- ズーム機能: 1.0x～3.0x倍率でスケール可能
- ダッシュボード: 人口、資金、快適度、経過月を表示
- タブメニュー: 道路 | 住宅 | 商業 | 工業 | インフラ | ランドマーク | 削除
- セーブ機能: 3つのセーブスロット
- インポート/エクスポート: JSON形式でのデータ交換
| 操作 | 効果 |
|---|---|
| 左クリック/タップ | 選択したツールで建設 |
| 左ドラッグ | 連続敷設（道路を続ける） |
| 右クリックドラッグ | 画面の移動（パン） |
| マウスホイール | ズーム（1.0x～3.0x） |
| タブボタン | 建物カテゴリ切り替え |
| キー | 効果 |
|---|---|
| R | 道路モード |
| S | 住宅モード |
| C | 商業モード |
| I | 工業モード |
| U | インフラモード |
| D | 削除モード |
| Space | 連続敷設ON/OFF |
- ⚙️ 設定: 難易度、災害・公害・スラム化システムを切り替え
- 💾 セーブ: 現在のゲームデータを3つのスロットに保存
- 📂 ロード: 保存されたデータを読み込み
- 📤 エクスポート: ゲームデータをJSON形式でダウンロード
- 📥 インポート: JSON形式のデータを読み込み
各スロットに以下の情報を保存:
- マップデータ（128x128グリッド）
- 人口、資金、快適度、月
- 建設モード、ポーズ状態
{
"version": "1.0.0",
"exportedAt": "2026-01-28T07:00:00.000Z",
"gameState": {
"map": [...],
"population": 5000,
"money": 150000,
"comfort": 75,
"month": 120,
...
}
}快適度は以下5つの指標の平均値です:
- 緑地率 (0-100): 公園の占める割合
- 交通充実度 (0-100): 駅の数と分布
- 人口密度 (0-100): 過密を避けるスコア
- 資金状況 (0-100): 資金/初期資金の比率
- 汚染度補正 (0-100): 工業地帯からの距離
| パラメータ | 初期値 | 範囲 | 説明 |
|---|---|---|---|
| 治安度 🔒 | 50 | 0-100 | 警察署の効果範囲で向上 |
| 安全度 🛡️ | 50 | 0-100 | 消防署の効果範囲で向上、火災抑制 |
| 教育度 📚 | 50 | 0-100 | 学校の効果範囲で向上、税収向上 |
| 医療度 ⚕️ | 50 | 0-100 | 病院の効果範囲で向上、病気抑制 |
| 観光度 🎭 | 0 | 0-100 | スタジアムの効果範囲で向上 |
| 国際化度 |
0 | 0-100 | 空港の効果範囲で向上 |
| 電力供給率 📡 | 0 | 0-100% | 発電所カバー率 |
| 給水率 💧 | 0 | 0-100% | 水処理施設カバー率 |
- 効果範囲: 半径30マス（マンハッタン距離）
- 治安度向上: 月額+5（距離に応じて減衰）
- 効果: 治安度が高いほど住宅地の成長速度が向上
- 配置戦略: 住宅密集地の中心に配置
- 効果範囲: 半径30マス
- 安全度向上: 月額+5
- 火災抑制: 効果範囲内で火災発生確率が75%低下
- 配置戦略: 工業地帯と住宅地の間に配置
- 効果範囲: 半径25マス
- 教育度向上: 月額+3
- 税収ボーナス: 教育度60以上で月額税収+15%
- 住宅成長: 教育度が高いほどLv4建物出現確率が向上
- 配置戦略: 住宅地の集約区を複数に分けて配置
- 効果範囲: 半径25マス
- 医療度向上: 月額+4
- 病気抑制: 効果範囲内で病気発生確率が60%低下
- 治癒速度: 医療度に応じて治療効果が向上
- 配置戦略: 人口密集地に配置
- 効果範囲: 半径20マス
- 成長促進: 周辺の建物成長速度が1.5倍
- 交通充実度: 駅の数が多いほど快適度向上
- 配置戦略: 都市を複数ゾーンに分割して配置
- 効果範囲: 半径15マス
- 快適度向上: +2
- 配置戦略: 住宅地に散在させるor中央広場型
- 効果範囲: 半径20マス
- 電力供給: 範囲内の建物が電力供給状態
- 成長ペナルティ: 電力未供給の建物は成長が40%低下
- 配置戦略: 大型都市なら複数配置、カバー率100%を目指す
- 効果範囲: 半径15マス
- 給水供給: 範囲内の建物が給水状態
- 成長ペナルティ: 給水未供給の建物は成長が70%低下
- 病気多発: 給水未供給地で病気発生確率が3倍
- 配置戦略: 大型都市なら複数配置、カバー率100%を目指す
- 効果範囲: 半径40マス
- 観光度向上: 月額+5
- 観光収入: 周辺商業地から追加収入
- L1: +500円/月
- L2: +1,000円/月
- L3: +2,000円/月
- L4: +3,000円/月
- 配置戦略: 大都市の中心に配置
- 効果範囲: 半径50マス
- 観光度向上: 月額+3（スタジアムより広範囲だが少ない）
- 国際化度向上: 月額+5
- 国際取引収入: 周辺商業地から追加収入
- L1: +1,000円/月
- L2: +2,000円/月
- L3: +3,500円/月
- L4: +5,000円/月
- 配置戦略: 都市の端に配置（広い敷地が必要）
駅 - 学校 - 住宅地
↕
警察署 - 公園
↕
消防署 - 商業地
発電所(1) ─ 駅(1) ─ 警察署 ─ 学校 ─ 住宅地群
↕
給水施設(1)
↕
病院
↕
消防署 - 商業地
↕
スタジアム
- 警察署+学校が近い（15マス以内）：治安度+10、教育度+10 ✅
- 学校+病院が近い（15マス以内）：教育度+5、医療度+5 ✅
- 駅+学校+警察署全て近い（20マス以内）：教育度+8（商業成長ボーナス相当） ✅
インフラが不足すると、ゲーム内の各パラメータが悪化し、以下のペナルティが発生します：
| インフラ不足 | ペナルティ | 具体的な影響 |
|---|---|---|
| 電力供給<50% | 成長-40%、税収-20% | 建物の成長速度が低下、収入が減少 |
| 給水不足<50% | 成長-70%、税収-30% | 建物がほぼ成長しない、病気発生3倍に |
| 治安度<40 | 成長-50% | 住宅地の成長が大幅低下 |
| 安全度<40 | 火災+2倍 | 火災発生確率が大幅増加 |
| 教育度<40 | 成長-40%、税収-15% | 商業地成長低下、収入減少 |
| 医療度<40 | 病気+2倍 | 病気発生確率が大幅増加、人口流出 |
複数のインフラが不足している場合、ペナルティは乗算されるため、状況は急速に悪化します：
- 電力なし × 給水なし → 成長が 18% に低下（0.6 × 0.3）
- 複合ペナルティでは大幅な経済悪化が発生
- インフラの優先配置: 発電所と水処理施設を早期に建設
- 警察署・消防署の配置: 治安度・安全度を維持
- 学校・病院の整備: 経済基盤の安定化
- ダッシュボード監視: パラメータが40以下にならないよう注視
git clone https://github.com/warasugitewara/easy-cities-2d.git
cd easy-cities-2d
npm install
npm run devnpm run build生成されたファイルは dist/ ディレクトリに出力されます。
- 言語: TypeScript
- ビルドツール: Vite
- レンダリング: Canvas API
- ストレージ: LocalStorage + JSON
- デプロイ: GitHub Pages
src/
├── main.ts # メインアプリケーション
├── engine.ts # ゲームロジック・シミュレーション
├── renderer.ts # Canvas描画処理
├── ui.ts # UIコンポーネント・操作
├── storage.ts # LocalStorage・JSON I/O
├── constants.ts # ゲーム定数
└── style.css # スタイル定義
- 都市を発展させる: 建設して人口を増やす
- 資金を管理する: 税収で維持費をカバーする
- 快適度を向上させる: 公園や駅を配置して住環境を整える
- バランスを取る: 成長と安定性の両立
Cities Skylines 2D版として複数の難易度が設定されています:
- イージー: 初期資金 350,000円、維持費 0.8倍、災害 0.5倍
- ノーマル: 初期資金 250,000円、維持費 1.0倍、災害 1.0倍
- ハード: 初期資金 150,000円、維持費 1.2倍、災害 1.5倍
資金無制限（∞） で自由に建設できるモードです。
- 経営管理の煩雑さから解放され、都市デザインに専念できます
- 初期設定画面でサンドボックスモードをON にすると有効
- ゲーム中の⚙️ 設定ボタンでもON/OFF 可能
- サンドボックスモードでは資金制限が無くなり、すべての建設がコスト 0 で実行できます
- 推奨用途:
- 都市設計を試す
- 特定のレイアウトをテストする
- 創造的な都市建設を楽しむ
- チュートリアル・練習モード
資金がマイナスになると破産しゲームオーバーです。
- 複数の建物タイプ（住宅、商業、工業）
- タブ式メニューUI（Cities Skylines風）
- ゲーム設定画面（難易度、システムON/OFF）
- タッチ対応（スマートフォン・タブレット）
- ドラッグビルド機能（連続敷設）
- カメラシステム（パン・ズーム）
- インフラシステム実装（水道、電力、消防、病院）
- 災害・イベント機能の実装（火災、病気）
- マップサイズ選択オプション（小・中・大）
- 複数マス占有建物（スタジアム、空港）
- メニューに色サンプル表示
- スラム化システム実装（機能計画中）
- シナリオモード（目標達成型）
- スコアランキング
需要メーター機能の統合・UI安定化
- 🗑️ 需要メーター独立ウィジェット削除
- 左下の不安定な需要メーターを廃止
- UI層のイベントブロッキング問題を根本解決
- 📊 ダッシュボードに需要値を統合
- 左上のダッシュボードに3つの需要値を常時表示
- 🏘️ 住宅地需要、🏪 商業地需要、🏭 工業地需要
- リアルタイム更新（常に建設可能）
- ✨ UI簡潔化（コード削減、ビルドサイズ削減）
サンドボックスモード実装
- 🎮 サンドボックスモード（資金∞）実装
- 初期設定画面でサンドボックスモードをON/OFF可能
- ゲーム中の⚙️ 設定ボタンでもON/OFF可能（リアルタイム切り替え）
- サンドボックスモード時は資金制限が無くなり、すべての建設がコスト 0 で実行可能
- 都市デザインに専念したいプレイヤーに最適
- チュートリアル・練習モードとしても利用可
- 📝 難易度セクションをREADMEに追加（イージー・ノーマル・ハード・サンドボックス）
需要メーターシステム・公害バランス調整
- 📊 需要メーターシステム実装
- 住宅・商業・工業の需要を計算・表示
- デマンドに応じた成長速度補正（±30%）
- デスクトップ版：ダッシュボード下部に表示（トグル可）
- モバイル版：ステータスタブ内に表示（トグル可）
- プログレスバー視覚化で需要が一目瞭然
- 🌍 公害システムの大幅改善
- 公害拡散機能を廃止（工業地帯に限定）
- 工業地レベルに応じた直接設定（L1:20, L2:40, L3:60, L4:80）
- 非工業地は自然減衰（-2/ターン）
- 快適度ペナルティを緩和（判定基準を50%・80%に）
- ゲーム性改善：プレイ可能な地域が広がる
- 🎮 ゲームバランス調整：需要システムで建築の戦略性が向上
実装漏れ修正・ゲームシステム完全化
- 🎮 難易度システム完全実装
- イージー：初期資金 350,000円、維持費 0.8倍、災害 0.5倍
- ノーマル：初期資金 250,000円、維持費 1.0倍、災害 1.0倍
- ハード：初期資金 150,000円、維持費 1.2倍、災害 1.5倍
- ✨ シナジー効果完全実装
- 警察+学校：治安度+10、教育度+10
- 学校+病院：教育度+5、医療度+5
- 駅+学校+警察（3施設）：教育度+8
- 💰 税収システム強化
- 教育度60以上で税収+15%（段階的に最大+16%）
- 観光度・国際化度で商業収入最大+200%
- 🏪 ランドマーク商業ボーナス実装
- スタジアム周辺（40マス）：L1-L4商業地に月額+500～3000円
- 空港周辺（50マス）：L1-L4商業地に月額+1000～5000円
- 🏥 医療度が快適度に反映
- 医療度70以上：快適度+3
- 医療度30以下：快適度-5
モバイルタッチ判定の正確性向上
- 🎯
screenToWorld()メソッド実装で DPR 対応座標変換を追加 - 📱 高DPI ディスプレイでのタッチ判定ズレを解消
- 🖼️ キャンバスサイズ計算を正確に（CSS サイズと内部サイズを分離）
- ✅ モバイル建物設置の操作性向上
モバイル UI レイアウト修正
- 📱 スマートフォン・タブレット向けに UI を完全に分離
- 🎮 デスクトップ版：既存のオーバーレイパネルを維持
- 📊 モバイル版：タブベースのシンプル UI に切り替え
- 📊 ステータスタブ：12項目を格子で表示
- 🏗️ 建設タブ：カテゴリセレクタ + オプションボタン
- ⏱️ 時間タブ：4つの時間制御ボタン
- ⚙️ メニュータブ：セーブ・ロード・設定
- 🖥️ キャンバス表示：50vh × 50vh 固定サイズ（上部）
- 📱 UI パネル：50vh 固定サイズ（下部）
- ✅ タッチイベント対応完全修正
安定版リリース：人口連動インフラスケーリング・完全機能実装
- 🎯 人口連動インフラスケーリング実装
- 警察：1個/1,000人口
- 消防署：1個/1,000人口
- 学校：1個/1,500人口
- 病院：1個/1,500人口
- 発電所：1個/2,000人口
- 水処理施設：1個/2,000人口
- 📈 不足インフラが月次更新で自動的に各パラメータを低下させる
- 🎮 ゲーム内クロック（一時停止・速度変更）とゲーム内日数を完全連動
- 💾 セーブ/ロード機能完全修正
- 🚀 初回安定版リリース
インフラ不足時ペナルティシステム・バグ修正
- 🐛 人口計算が月次更新で呼ばれていない問題を修正
- 💰 資金無限増殖バグを修正（ランドマーク月額収入を調整）
- 🔥 インフラ不足ペナルティシステム実装
- 電力供給不足（<50%）：成長-40%、税収-20%
- 給水不足（<50%）：成長-70%、税収-30%、病気発生+3倍
- 治安度不足（<40）：住宅成長-50%
- 安全度不足（<40）：火災発生+2倍
- 教育度不足（<40）：成長-40%、税収-15%
- 医療度不足（<40）：病気発生+2倍、人口流出
- 📊 ペナルティは乗算される（複合ペナルティで急速悪化）
- 💧 ローカルペナルティシステム：個別タイルの電力・給水状態を確認
- 📖 READMEにペナルティシステム詳細ガイドを追加
セーブ・ロード機能修正
- 🐛 StorageManager のメソッド名が UI と一致していない問題を修正
saveSlot()→saveGame()に統一loadSlot()→loadGame()に統一
- 📊 セーブ・ロード時のコンソールログを追加
- ✅ セーブスロットへの保存・読み込みが正常に機能するように修正
インフラ・ランドマーク詳細システム実装・ゲーム速度連動
- ⏰ ゲーム速度がタイマー（ポーズ・遅い・通常・高速）と連動
- ポーズ中は月次更新完全停止
- 遅い：通常の50%速度、高速：通常の2倍速度
- 🔒 治安度システム：警察署から半径30マスで治安度向上
- 🛡️ 安全度システム：消防署から半径30マスで安全度向上、火災抑制
- 📚 教育度システム：学校から半径25マスで教育度向上、税収向上
- ⚕️ 医療度システム：病院から半径25マスで医療度向上、病気抑制
- 🎭 観光度システム：スタジアムから半径40マスで観光度向上
✈️ 国際化度システム：空港から半径50マスで国際化度向上- 📡 電力供給率：発電所から半径20マス、未供給地の成長40%低下
- 💧 給水率：水処理施設から半径15マス、未給水地の成長70%低下
- 📊 ダッシュボード拡張：6つの新パラメータ表示（治安、安全、教育、医療、観光、国際化）
- 📋 インフラシステム詳細ガイドをREADMEに追加
インフラ・ランドマーク色分け修正
- 🎨 インフラとランドマークの色が正しく反映されるように修正
- 🔧 UIボタン選択時にゲームエンジンの状態を同期
- 💸 各施設の建設コスト計算を修正（施設タイプごとの正確なコスト）
- 📋 バージョン表示追加（ゲーム開始画面・タイトルバー・HTML title）
パフォーマンス最適化・UI改善・機能拡張
- ✨ 火災・病気のビジュアル表示（赤・黄でハイライト）
- 🚀 大マップでのパフォーマンス最適化（サンプリング処理）
- 🎯 当たり判定修正（タイル中心ベース計算）
- 🛠️ 複数マス建築物の一括削除機能
- 🎨 インフラ・ランドマークメニューに色サンプル表示
- 🔍 メニューのレイアウト改善（見やすさ向上）
災害・インフラシステム実装
- 🔥 火災システム（ランダム発生、消防署で消火）
- 🤒 病気システム（密集地発生、病院で治癒）
- ⚡ 電力供給システム（発電所から半径20マス）
- 💧 水道供給システム（水処理施設から半径15マス）
- 🏗️ ランドマークの複数マス対応（スタジアム4×4、空港6×6）
- 🎨 改善された色分け（RGB値最適化）
UI改善・建物拡張
- 🎛️ ドラッグ可能なUIパネル
- ⏸ ゲーム速度制御（ポーズ・遅い・通常・高速）
- 🏗️ インフラ施設追加（駅、公園、警察署、消防署、病院、学校、発電所、水処理施設）
- 🏛️ ランドマーク実装（スタジアム、空港）
- 📊 複数マス占有建物システム
UI・マップサイズ拡張
- 🎨 オーバーレイUI化（ダッシュボード、メニューのレイアウト改善）
- 📐 マップサイズ選択（小・中・大）
- 🔧 動的グリッドサイズ対応
- 🎯 GUI表示非表示ボタン
- 📱 タッチイベント完全対応
初版リリース
- 🏙️ 基本的なゲーム機能（道路、住宅、商業、工業）
- 💰 経済システム（税収・維持費）
- 👥 人口管理（自動成長）
- 😊 快適度スコア計算
- 📱 タッチ・マウス対応
- 💾 セーブ・ロード機能
- 🎮 難易度選択（イージー・ノーマル・ハード）
MIT License
バグ報告や機能リクエストは、GitHubのIssuesでお願いします。
オリジナル版制作: 松島さん
改良・2D版開発: warasugitewara
🏗️ Easy Cities 2D - ブラウザ型都市シミュレーター 🏗️
楽しい都市経営をお楽しみください！質問やバグ報告はGitHub Issuesまでお願いします。