DataV-Team / Datav React
Licence: mit
React数据可视化组件库(类似阿里DataV,大屏数据展示),提供SVG的边框及装饰、图表、水位图、飞线图等组件,简单易用,长期更新
Stars: ✭ 427
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Datav React
Shapeshifter
SVG icon animation tool for Android, iOS, and the web
Stars: ✭ 3,705 (+767.68%)
Mutual labels: svg
Britecharts
Client-side reusable Charting Library based on D3.js v5 that allows easy and intuitive use of charts and components that can be composed together creating amazing visualizations.
Stars: ✭ 3,688 (+763.7%)
Mutual labels: svg
Vue Sample Svg Icons
An opinionated example of how to use SVG icons in a Vue.js application
Stars: ✭ 399 (-6.56%)
Mutual labels: svg
Poplar
A web-based annotation tool for natural language processing (NLP)
Stars: ✭ 403 (-5.62%)
Mutual labels: svg
Bytesize Icons
Tiny style-controlled SVG iconset (101 icons, 12kb)
Stars: ✭ 3,662 (+757.61%)
Mutual labels: svg
Jam
Jam icons is a set of SVG icons designed for web projects, illustrations, print projects, etc. Licensed under MIT
Stars: ✭ 398 (-6.79%)
Mutual labels: svg
Jquery.flowchart
JQuery plugin that allows you to draw a flow chart.
Stars: ✭ 413 (-3.28%)
Mutual labels: svg
Verovio
🎵 Music notation engraving library for MEI with MusicXML and Humdrum support and various toolkits (JavaScript, Python)
Stars: ✭ 375 (-12.18%)
Mutual labels: svg
Sharp
High performance Node.js image processing, the fastest module to resize JPEG, PNG, WebP, AVIF and TIFF images. Uses the libvips library.
Stars: ✭ 21,131 (+4848.71%)
Mutual labels: svg
Svg Screenshots
📸🧩 Browser extension to take scalable, semantic, accessible screenshots of websites in SVG format.
Stars: ✭ 404 (-5.39%)
Mutual labels: svg
Plain Draggable
The simple and high performance library to allow HTML/SVG element to be dragged.
Stars: ✭ 362 (-15.22%)
Mutual labels: svg
Deepsvg
[NeurIPS 2020] Official code for the paper "DeepSVG: A Hierarchical Generative Network for Vector Graphics Animation". Includes a PyTorch library for deep learning with SVG data.
Stars: ✭ 403 (-5.62%)
Mutual labels: svg
React Native Svg Animated Linear Gradient
A wrap SVG component for animated linear gradient
Stars: ✭ 418 (-2.11%)
Mutual labels: svg
Icons
Official open source SVG icon library for Bootstrap.
Stars: ✭ 5,735 (+1243.09%)
Mutual labels: svg
DataV-React
DataV-React 是干什么的?
- DataV-React 是一个基于React的数据可视化组件库(当然也有Vue 版本)
- 提供用于提升页面视觉效果的SVG边框和装饰
- 提供常用的图表如折线图等
- 飞线图/轮播表等其他组件
注意事项
使用了 React Hooks, 简化了许多内部工作。您需要 React 版本 16.8.0 及以上
npm 安装
$ npm install @jiaminghi/data-view-react
使用
import * as datav from "@jiaminghi/data-view-react";
datav.BorderBox1;
// 或者
import { BorderBox1 } from "@jiaminghi/data-view-react";
// 按需引入
import BorderBox1 from "@jiaminghi/data-view-react/es/borderBox1";
详细文档及示例请移步HomePage.
UMD 版
UMD
版可直接使用script
标签引入,引入后通过datav命名空间使用对应的组件,引入data-view-react
前请确保已引入react 和 react-dom
。
TODO
- 地图组件
- TS重构组件库底层依赖
致谢
组件库的开发基于个人学习和兴趣,由于技术水平及经验的限制,组件尚有许多不完善之处,如有 BUG 可及时提交issue或添加反馈群进行反馈,也欢迎提供指正和建议,感谢各位的支持。
反馈
Demo
Demo 页面使用了全屏组件,请 F11 全屏后查看。
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].