C# 開發 WPF/Silverlight 動畫與遊戲教學 (41-1)：打造精美迷你雷達地圖 (上)

迷你雷達地圖設計與製作完整指南

本系列進入迷你地圖製作篇章。迷你地圖分為導航雷達地圖 (右上角常駐) 與全景尋路地圖兩類。本文著重講解導航雷達地圖的設計思路與核心功能實現。

一、設計階段：功能規劃與介面原型

核心功能模組：

1. 顯示/隱藏切換：控制可視區域 Visibility，關閉時停止邏輯運算與渲染，大幅降低 CPU 佔用
2. 縮放功能：支援多級縮放，適應不同遊戲場景需求

二、縮放功能核心方案：預製統一尺寸縮圖

步驟 1：製作標準化縮圖

• 地圖原始尺寸 4800×3600 → 縮小 8 倍 → 600×450，JPG 品質 30，體積 ~30KB
• 第二地圖 2400×1800 → 縮小 4 倍 → 同樣 600×450
• 統一尺寸便於後續尋路地圖複用

步驟 2：XML 配置縮放參數

<MiniMap Scaling="8" MinScaling="1" MaxScaling="30" />

對應介面上的基準縮放值 (X) 與縮放按鈕 (-/+) 的操作範圍。

三、效能考量：為什麼需要開關控制

雷達地圖相當於遊戲視窗的縮小副本，包含大量動態元素更新。在大規模戰鬥場景中，關閉雷達可釋放寶貴 CPU 資源，確保戰鬥流暢度。這是 Web 遊戲效能調優的關鍵手段之一。