紫微斗数 | 对算命有兴趣的程序员请进

user image 发现 ----- 2023-11-06 19:54:06
基于 iztro 的 react 组件,用于生成一张紫微斗数星盘。
react component of iztro used to generate an astrolabe of Zi Wei Dou Shu.
npm npm GitHub GitHub code size in bytes Package Quality
功能展示完整紫微斗数星盘
包含所有 主星,辅星,杂耀,四化,神煞,流耀 以及星耀的 亮度。高亮显示重要的星耀,比如 桃花星,解神,禄存 和 天马。
合理的星耀分布
用不同的颜色和字号来将 星耀,宫名,宫干 等分区域显示,解盘一目了然,直击重点。
清晰的运限指示
在宫位中明显的标示出 大限、小限、流年、流月、流日、流时 所在宫位,点击运限指示按钮以后会显示重排后的运限宫名以及运限四化,更加方便的使用叠宫技巧解盘。
流耀显示
展示出各个流派都需要的 流耀,可自行选择自己熟悉的流耀进行解盘。
三方四正指示线
在中宫会显示 三方四正 指示线,点击运限时指示线的指向会动态跟随选中的最小那个运限流动,比如同时选择 流年 和 流月,指示线会跟随 流月。
强大的动态运限
在 中宫 里,除了显示基本信息和三方四正线以外,还加入了可以调整运限的按钮组,可以非常方便的移动各个维度的运限。
简单易用的组件
零配置快速集成到你的页面中,对于集成几乎没有学习成本。你可以根据自己的页面风格自行调整样式,或控制各个元素的显示与隐藏(通过覆盖默认样式)。
集成到页面中的界面如下图所示。你也可以直接访问官方的 紫微派 - 紫微斗数在线排盘 查看效果。
react-iztro如果你觉得该组件对你有用,希望给个⭐️⭐️鼓励一下。
安装npm install react-iztro -S当然你也可以使用 yarn
yarn add react-iztro使用import {Iztrolabe} from "react-iztro"
function App() {  return (    <div className="App" style={{ width: 1024, margin: '50px auto', boxShadow: '0 0 25px rgba(0,0,0,0.25)'}}>      <Iztrolabe         birthday="2003-10-12"         birthTime={1}         birthdayType="solar"         gender="male"         horoscopeDate={new Date()} // 新增参数,设置运限日期 [可选,默认为当前时间]         horoscopeHour={1}  // 新增参数,设置流时时辰的索引 [可选,默认会获取 horoscopeDate 时间]       />    </div>  );}
export default App;

使用说明