📦 react-iztro

基于 iztro 的 react 组件，用于生成一张紫微斗数星盘。

react component of iztro used to generate an astrolabe of Zi Wei Dou Shu.

功能

展示完整紫微斗数星盘

包含所有 主星，辅星，杂耀，四化，神煞，流耀 以及星耀的 亮度。高亮显示重要的星耀，比如 桃花星，解神，禄存 和 天马。
合理的星耀分布

用不同的颜色和字号来将 星耀，宫名，宫干 等分区域显示，解盘一目了然，直击重点。
清晰的运限指示

在宫位中明显的标示出 大限、小限、流年、流月、流日、流时 所在宫位，点击运限指示按钮以后会显示重排后的运限宫名以及运限四化，更加方便的使用叠宫技巧解盘。
流耀显示

展示出各个流派都需要的 流耀，可自行选择自己熟悉的流耀进行解盘。
三方四正指示线

在中宫会显示 三方四正 指示线，点击运限时指示线的指向会动态跟随选中的最小那个运限流动，比如同时选择 流年 和 流月，指示线会跟随 流月。
强大的动态运限

在 中宫 里，除了显示基本信息和三方四正线以外，还加入了可以调整运限的按钮组，可以非常方便的移动各个维度的运限。
简单易用的组件

零配置快速集成到你的页面中，对于集成几乎没有学习成本。你可以根据自己的页面风格自行调整样式，或控制各个元素的显示与隐藏（通过覆盖默认样式）。

集成到页面中的界面如下图所示。你也可以直接访问官方的紫微派 - 紫微斗数在线排盘查看效果。

如果你觉得该组件对你有用，希望给个⭐️⭐️鼓励一下。

安装

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;

第 1 条附言 · 2023-11-03 10:42:59 +08:00

大佬们别光看热闹啊，记得帮小弟 star 一下 https://github.com/SylarLong/react-iztro 😂

第 2 条附言 · 2023-11-03 16:07:55 +08:00

我也是没想到这个帖子突然咋就火了呢😂，我是来介绍我的开源库的，评论区逐渐变成求解盘的了这是什么情况？

第 3 条附言 · 2023-11-03 19:43:22 +08:00

非常抱歉，实在没有办法一一为大家看盘，我实在是没想到这居然成了一个解盘贴😂大家可以查看紫微斗数文档自行学习。虽然文档还在完善中，但是入个门没啥问题了～

第 4 条附言 · 2023-11-04 15:24:08 +08:00

我也是没想到问群的朋友那么多！呐，我放个🛰️在这儿，如果想进群的朋友自取