反应光谱图
文档
目录
概览
react-spectrum-charts 是一个用于在React中编译图表的宣示性图表库。 它使你能够按照Adobe的设计系统,不费力地绘制视觉惊艳的图表(光谱) 有最小代码. 不需要了解图形的语法或D3或Vega等下层库.
关键特性 :
-
直观:开发者经验在API设计中居于首位. 声明式API取消了理解高级数据可视化概念的需要. 密码读起来就像你会向别人解释图表一样.
-
可配置:基于组件的构件使您能够构建解决您的使用大小写的图表。 模块化设计使得用简单易懂的代码来作曲复杂的可视化.
-
证明:利用光谱Adobe 光谱设计系统)你得到美丽的图表 支持的研究,用户测试,和行业最佳做法.
-
国际: 支持 30+ 日期/ 数字 地块, 以便用户能够以预期的格式查看数据 .
安装
无
npm install @adobe/react-spectrum-charts @adobe/react-spectrum vega vega-lite
线条
yarn add @adobe/react-spectrum-charts @adobe/react-spectrum vega vega-lite
使用量
react-spectrum-charts 其设计方式使图表的编组与JSX中的任何其他应用内容的编组类似.
每个图表都被包裹在 <Chart/> 组件。 儿童部件及其道具控制图表的内容.
示例
import React from 'react';
import {Axis, Bar, Legend, Chart} from '@adobe/react-spectrum-charts';
const MyChart: FC<MyChartProps> = (props) => {
...
return (
<Chart data={myChartData}>
<Axis position="bottom" />
<Axis position="left" />
<Bar type="stacked" color="series" />
<Legend />
</Chart>
)
}
光谱( Adobe 设计系统) 集成
Adobe的设计系统有绘制基本图的详细指南,图的颜色选择以及主图组件的设计指南.
react-spectrum-charts 执行本准则时的反应.
API 密码
故事书
这个图书馆有一大堆 故事书 每一个组件和大多数道具都有故事 您可以使用故事书中的控制标签来更改组件道具并查看这如何实时地改变图表.
还可以通过选择"Docs"分页来查看任何故事的源代码,向想要的故事滚动并再选择"显示代码". 这有利于在故事书中看到任何故事的完整API.
"故事本"可能包含自每次向主推而被重建后尚未发行的组件或道具,而不仅仅是npm发行后.
支助
遇到任何问题、有问题或需要援助的人 反应-光谱-图,获得支持的方法有几种:
-
文档: 检查 正式文件 例如,API文档和开发者文件.
-
GitHub 问题: 如果您认为您已识别出一个错误或有特性请求或有一般反馈, 请审查列表 未决问题 以查看是否有其他人已经提交了一个类似问题,您可以加入。 如果不存在问题,请使用正确的模板提交新问题(创建一个新问题) (中文(简体) ).
请在寻求支持时尊重并体谅. 在报告问题时尽可能提供背景,并遵循GitHub问题一节所指明的任何准则或模板。 你的反馈和贡献受到高度重视.
捐款
许可证
反应-光谱-图 是在“软件”下发布的开源软件 Apache 许可证 2.0您可以在 自由主义 包含在工程中的文件 .
Apache 许可证 2.0 摘要
-
权限: 您获得使用、修改、分发和分版软件的广泛许可。 可以作商业用途.
-
条件:您必须包含原始版权通知和免责声明. 您无法使用项目的商标, 但没有适当的归属 .
-
限制:许可证不是保证书,软件是"照样"提供的. 项目的出资人不承担任何损失.
-
更多信息:关于Apache许可证2.0的完整而详细的解释,请参见: 正式许可证文件。 。 。 .
通过使用 反应-光谱-图,你同意遵守 Apache 许可证2.0的条款和条件.
请审查 自由主义 证书的完整文本.
路线图
Github项目跟踪了该项目的路线图。 你一定是Adobe Org的成员 看路线图.