- 添加 ts/README.md 约定文档(每个实验独立 npm 项目) - 新增 ts/web/astro/polaris 实验项目说明与 logo - .gitignore 增加 Node/TypeScript 忽略规则 - 根 README 目录说明补充 ts/ 条目
112 lines
5.6 KiB
XML
112 lines
5.6 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="100%" height="100%">
|
|
<!-- 背景透明 -->
|
|
|
|
<defs>
|
|
<!-- 渐变:高亮发光青蓝 到 科技蓝 -->
|
|
<linearGradient id="magicCyan" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" stop-color="#00F2FE" />
|
|
<stop offset="100%" stop-color="#3B82F6" />
|
|
</linearGradient>
|
|
|
|
<!-- 渐变:深邃蓝 (指针反向切面与暗部) -->
|
|
<linearGradient id="magicDark" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" stop-color="#1E293B" />
|
|
<stop offset="100%" stop-color="#0F172A" />
|
|
</linearGradient>
|
|
|
|
<!-- 霓虹发光 Glow 滤镜 -->
|
|
<filter id="magicGlow" x="-20%" y="-20%" width="140%" height="140%">
|
|
<feGaussianBlur stdDeviation="4" result="blur" />
|
|
<feComposite in="SourceGraphic" in2="blur" operator="over" />
|
|
</filter>
|
|
</defs>
|
|
|
|
<!-- ==================== 丰富高精度的极客魔法阵 (Geek Magic Array) ==================== -->
|
|
|
|
<!-- 1. 最外层:外边界细环与四角法术引线节点 -->
|
|
<circle cx="256" cy="256" r="242" fill="none" stroke="#00F2FE" stroke-width="1.5" stroke-opacity="0.5" />
|
|
<circle cx="256" cy="256" r="236" fill="none" stroke="#3B82F6" stroke-width="2.5" stroke-opacity="0.8" />
|
|
|
|
<!-- 外圈四极极客指示顶点 -->
|
|
<path d="M 256 8 L 266 26 L 246 26 Z" fill="#00F2FE" filter="url(#magicGlow)" />
|
|
<path d="M 256 504 L 266 486 L 246 486 Z" fill="#2563EB" opacity="0.6" />
|
|
<path d="M 8 256 L 26 246 L 26 266 Z" fill="#2563EB" opacity="0.6" />
|
|
<path d="M 504 256 L 486 246 L 486 266 Z" fill="#2563EB" opacity="0.6" />
|
|
|
|
<!-- 2. 精密仪表与符文刻度带 (外环与内环间) -->
|
|
<circle cx="256" cy="256" r="226" fill="none" stroke="#00F2FE" stroke-width="6" stroke-dasharray="2 6" stroke-opacity="0.75" />
|
|
<circle cx="256" cy="256" r="216" fill="none" stroke="#3B82F6" stroke-width="1.5" stroke-opacity="0.4" />
|
|
|
|
<!-- 精算刻度环:6个长粗虚线的中心点完全对齐正六边形与角点的 60° 几何角 -->
|
|
<circle cx="256" cy="256" r="210" fill="none" stroke="#00F2FE" stroke-width="4.5"
|
|
stroke-dasharray="25 8 6 15.977872" stroke-dashoffset="-12.5" stroke-opacity="0.85" filter="url(#magicGlow)" />
|
|
|
|
<!-- 3. 魔法阵三重嵌套多边形结界 (正三角形 + 正六边形 + 12角星线拓扑) -->
|
|
<g fill="none" stroke="#3B82F6" stroke-width="1.5" stroke-opacity="0.5">
|
|
<!-- 正六边形 A (顶角精确落于 r=210 粗虚线长段) -->
|
|
<polygon points="256,46 437.86,151 437.86,361 256,466 74.14,361 74.14,151" stroke="#00F2FE" stroke-width="1.8" stroke-opacity="0.7" />
|
|
<!-- 正六边形 B (旋转30度) -->
|
|
<polygon points="361,74.14 466,256 361,437.86 151,437.86 46,256 151,74.14" />
|
|
<!-- 正三角形 C (向上) -->
|
|
<polygon points="256,46 437.86,361 74.14,361" stroke="#00F2FE" stroke-width="1" stroke-opacity="0.4" />
|
|
<!-- 正三角形 D (向下) -->
|
|
<polygon points="256,466 74.14,151 437.86,151" stroke="#00F2FE" stroke-width="1" stroke-opacity="0.4" />
|
|
</g>
|
|
|
|
<!-- 4. 六方位魔法法阵节点圈 (在多边形顶点上的极客元素) -->
|
|
<g fill="#0F172A" stroke="#00F2FE" stroke-width="2" opacity="0.95">
|
|
<circle cx="256" cy="46" r="10" />
|
|
<circle cx="437.86" cy="151" r="10" />
|
|
<circle cx="437.86" cy="361" r="10" />
|
|
<circle cx="256" cy="466" r="10" />
|
|
<circle cx="74.14" cy="361" r="10" />
|
|
<circle cx="74.14" cy="151" r="10" />
|
|
</g>
|
|
|
|
<!-- 节点内发光核 -->
|
|
<g fill="#00F2FE" filter="url(#magicGlow)">
|
|
<circle cx="256" cy="46" r="4" />
|
|
<circle cx="437.86" cy="151" r="4" />
|
|
<circle cx="437.86" cy="361" r="4" />
|
|
<circle cx="256" cy="466" r="4" />
|
|
<circle cx="74.14" cy="361" r="4" />
|
|
<circle cx="74.14" cy="151" r="4" />
|
|
</g>
|
|
|
|
<!-- 5. 中阶魔法阵环与细分刻度 -->
|
|
<circle cx="256" cy="256" r="186" fill="none" stroke="#00F2FE" stroke-width="2" stroke-opacity="0.8" filter="url(#magicGlow)" />
|
|
<circle cx="256" cy="256" r="176" fill="none" stroke="#2563EB" stroke-width="3" stroke-dasharray="12 6 4 6" stroke-opacity="0.6" />
|
|
<circle cx="256" cy="256" r="166" fill="none" stroke="#00F2FE" stroke-width="1" stroke-dasharray="2 4" stroke-opacity="0.5" />
|
|
|
|
<!-- 6. 魔法阵放射状流向线 (16等分星射线) -->
|
|
<g stroke="#00F2FE" stroke-width="1" stroke-opacity="0.2">
|
|
<line x1="256" y1="26" x2="256" y2="486" />
|
|
<line x1="26" y1="256" x2="486" y2="256" />
|
|
<line x1="93" y1="93" x2="419" y2="419" />
|
|
<line x1="419" y1="93" x2="93" y2="419" />
|
|
</g>
|
|
|
|
<!-- ==================== 中心:硬核极客机甲指针 (中间区域干净无符号) ==================== -->
|
|
|
|
<g transform="rotate(28, 256, 256)">
|
|
<!-- 北向主指针(立体几何亮蓝切面) -->
|
|
<path d="M 256 70 L 306 226 L 256 256 Z" fill="url(#magicCyan)" filter="url(#magicGlow)" />
|
|
<!-- 北向副切面(深蓝阴影) -->
|
|
<path d="M 256 70 L 206 226 L 256 256 Z" fill="#1D4ED8" />
|
|
|
|
<!-- 指针侧翼机甲组件 -->
|
|
<path d="M 312 236 L 332 266 L 282 256 Z" fill="#00F2FE" opacity="0.7" />
|
|
<path d="M 200 236 L 180 266 L 230 256 Z" fill="#2563EB" opacity="0.7" />
|
|
|
|
<!-- 南向反向指针(深色金属质感) -->
|
|
<path d="M 256 442 L 220 286 L 256 256 Z" fill="url(#magicDark)" />
|
|
<path d="M 256 442 L 292 286 L 256 256 Z" fill="#334155" />
|
|
</g>
|
|
|
|
<!-- 中心核心:反应堆式同心轴 -->
|
|
<circle cx="256" cy="256" r="32" fill="#0F172A" stroke="#00F2FE" stroke-width="3" />
|
|
<circle cx="256" cy="256" r="18" fill="none" stroke="#3B82F6" stroke-width="2" stroke-dasharray="6 3" />
|
|
<circle cx="256" cy="256" r="8" fill="#00F2FE" filter="url(#magicGlow)" />
|
|
<circle cx="256" cy="256" r="3" fill="#FFFFFF" />
|
|
</svg>
|