All Projects → DataV-Team → Datav React

DataV-Team / Datav React

Licence: mit
React数据可视化组件库(类似阿里DataV,大屏数据展示),提供SVG的边框及装饰、图表、水位图、飞线图等组件,简单易用,长期更新

Programming Languages

javascript
184084 projects - #8 most used programming language

Labels

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
Postcss Sprites
Generate sprites from stylesheets.
Stars: ✭ 402 (-5.85%)
Mutual labels:  svg
Vue Bar
Simple, elegant spark bars for Vue.js
Stars: ✭ 414 (-3.04%)
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
Pts
A library for visualization and creative-coding
Stars: ✭ 4,628 (+983.84%)
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
Pixo
Convert SVG icons into React components
Stars: ✭ 371 (-13.11%)
Mutual labels:  svg
Oblivion
The language of Art
Stars: ✭ 414 (-3.04%)
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
Ngx Charts
📊 Declarative Charting Framework for Angular
Stars: ✭ 4,057 (+850.12%)
Mutual labels:  svg

ENGLISH

DataV-React

LICENSE LICENSE

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

UMD 版使用示例

TODO

  • 地图组件
  • TS重构组件库底层依赖

致谢

组件库的开发基于个人学习和兴趣,由于技术水平及经验的限制,组件尚有许多不完善之处,如有 BUG 可及时提交issue或添加反馈群进行反馈,也欢迎提供指正和建议,感谢各位的支持。

反馈

Feedback

Demo

Demo 页面使用了全屏组件,请 F11 全屏后查看。

construction-data

manage-desk

electronic-file

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].