阅读时长：约 18 分钟 | 难度：★★★★☆ | 篇章：第 7 篇 · 风水罗盘模块 对应源码：
entry/src/main/ets/pages/fengshui/LuopanPage.ets
前言
二十四山是风水罗盘的核心方位标识系统。玄象项目通过极坐标算法将 24 个方位汉字（子、癸、丑、艮、寅、甲等）精确绘制在罗盘圆周上。本篇将深入剖析玄象项目二十四山方位汉字定位算法的实现：从极坐标到直角坐标转换、fillText文字定位、textAlign文字对齐，到二十四山数据结构。掌握这套二十四山定位算法，您就能为任何 HarmonyOS 应用构建罗盘方位标识系统。
提示：二十四山每 15° 一个方位，覆盖 360° 圆周。
一、二十四山数据
1.1 数据结构
interface TwentyFourShan { name: string; // 方位名 degree: string; // 角度 wuxing: string; // 五行 }二、极坐标定位算法
2.1 文字定位
private drawTwentyFourShan(canvas: CanvasRenderingContext2D, cx: number, cy: number, r: number): void { for (let i = 0; i < 24; i++) { const angle = (i * 15 - 90) * Math.PI / 180; const textR = r * 0.78; const x = cx + textR * Math.cos(angle); const y = cy + textR * Math.sin(angle); canvas.fillStyle = Colors.PRIMARY_GOLD; canvas.font = '14px sans-serif'; canvas.textAlign = 'center'; canvas.fillText(this.twentyFourShan[i].name, x, y + 5); } }三、二十四山定位算法设计总结
3.1 参数说明
| 参数 | 值 | 说明 |
|---|---|---|
| 总数 | 24 | 二十四山 |
| 间隔 | 15° | 360° / 24 |
| 起始偏移 | -90° | 正上方为子 |
| 半径比例 | 0.78 | 刻度与中心之间的中间位置 |
总结
本篇以玄象项目二十四山方位汉字定位为蓝本，深入剖析了 Canvas 极坐标文字定位算法：从极坐标到直角坐标转换、fillText文字定位、textAlign文字对齐，到二十四山数据结构。掌握这套二十四山定位算法，您就能为任何 HarmonyOS 应用构建罗盘方位标识系统。
如果这篇文章对你有帮助，欢迎点赞👍、收藏⭐、关注🔔，你的支持是我持续创作的动力！
相关资源：
- 二十四山：wikipedia.org/wiki/二十四山
- 开源鸿蒙跨平台社区：https://openharmonycrossplatform.csdn.net