react-vis-force - d3-force graphs as React Components.

  •        268

react-vis-force applies the react-vis and d4-style component approach to the d3-force library. This allows users to declaratively provide links and nodes as children of a ForceGraph component.

http://uber.github.io/react-vis-force
https://github.com/uber/react-vis-force

Dependencies:

d3-force : ^1.0.2
global : ^4.3.0
lodash.reduce : ^4.6.0
prop-types : ^15.5.10

Tags
Implementation
License
Platform

   




Related Projects

react-vis - Data-Visualization oriented components

  •    Javascript

A collection of react components to render common data visualization charts, such as line/area/bar charts, heat maps, scatterplots, contour plots, pie and donut charts, sunbursts, radar charts, parallel coordinates, and tree maps.Install react-vis via npm.

ngx-graph - Graph visualization library for angular

  •    TypeScript

This library is focused on handling graph data (anything with nodes and edges) rather than chart data. Currently the only visualization uses the Dagre layout, which is specialized for directed graphs. The plan is to implement multiple visualisations for graph data within this same library. Eventually, ngx-charts-force-directed-graph may be imported into this library as another option to visualize your graph data. ngx-graph is a Swimlane open-source project; we believe in giving back to the open-source community by sharing some of the projects we build for our application. Swimlane is an automated cyber security operations and incident response platform that enables cyber security teams to leverage threat intelligence, speed up incident response and automate security operations.

GoJS - JavaScript diagramming library for interactive flowcharts, org charts, design tools, planning tools, visual languages

  •    Javascript

GoJS is a JavaScript and TypeScript library for creating and manipulating diagrams, charts, and graphs. GoJS is a flexible library that can be used to create a number of different kinds of interactive diagrams, including data visualizations, drawing tools, and graph editors. There are samples for flowchart, org chart, business process BPMN, swimlanes, timelines, state charts, kanban, network, mindmap, sankey, family trees and genogram charts, fishbone diagrams, floor plans, UML, decision trees, pert charts, Gantt, and hundreds more. GoJS includes a number of built in layouts including tree layout, force directed, radial, and layered digraph layout, and a number of custom layout examples.

react-map-gl - React friendly API wrapper around MapboxGL JS

  •    Javascript

In addition to exposing MapboxGL functionality to React apps, react-map-gl also integrates seamlessly with deck.gl.browserify - react-map-gl is extensively tested with browserify and works without configuration.

jGraph - Graph Drawing Component in Java

  •    Java

JGraphX (aka JGraph 6) is the most powerful, easy-to-use and feature-rich graph drawing component available for Java. It could draw hierarchical, circular, trees and force-directed graphs. Its feature include zoom, moving, edge editing, attribute maps and lot more.


vx - ๐Ÿฏreact + d3 = vx | visualization components

  •    Javascript

vx is a collection of reusable low-level visualization components. vx combines the power of d3 to generate your visualization with the benefits of react for updating the DOM. Let's make a simple bar graph.

dependo - Visualize your CommonJS or AMD module dependencies in a force directed graph report.

  •    HTML

Visualize your CommonJS, AMD, or ES6 module dependencies in a force directed graph report - powered by D3.js. Let me introduce dependo - A small visualization tool that draws an force directed graph of JavaScript dependencies pulled from a codebase of CommonJS, AMD, or ES6. Behind the scene I’m using a wonderful library named node-madge, to extract the dependencies and combined with the power of D3.js I draw a beautiful zoomable directed graph.

springy - A force directed graph layout algorithm in JavaScript

  •    Javascript

A force directed graph layout algorithm in JavaScript. Springy is a force directed graph layout algorithm.

react-d3-library - Open source library for using D3 in React

  •    Javascript

An open source library that will allow developers the ability to reroute D3 output to React’s virtual DOM. Just use your existing D3 code, and with a few simples lines, you can now harness the power of React with the flexibility of D3! React-D3-Library will compile your code into React components, and it also comes with a series of D3 template charts converted to React components for developers who are unfamiliar with D3. Not only do we build fully functional React components, but they utilize the power of D3 to automate scaling ranges, normalizing data, and constructing legends.

deck.gl - WebGL based visualization layers

  •    Javascript

Provides tested, highly performant layers for data visualization, such as scatterplots, arcs, geometries defined in GeoJSON, etc...To learn how to use deck.gl through examples coming with the deck.gl repo, please clone the latest release branch.

react-trend - ๐Ÿ“ˆ Simple, elegant spark lines

  •    Javascript

These are very simple and elegant visualizations, and they should not require a bloated graphing library to produce. React Trend is a concrete component that does 1 thing, and does it well: generate these trending graphs.

react-d3-components - D3 Components for React

  •    Javascript

Let React have complete control over the DOM even when using D3. This way we can benefit from Reacts Virtual DOM. to start a webserver, and navigate to http://localhost:8000/example in order to visualize the new example page. Note that the example page directly points to the dist folder.

react-native-pathjs-charts - Android and iOS charts based on react-native-svg and paths-js

  •    Javascript

This library is a cross-platform (iOS/Android) library of charts/graphs using react-native-svg and paths-js based on the excellent work done by Roman Samec in the react-pathjs-chart library. The project is an early attempt at providing a ubiquitous solution for charts & graphs for React Native that offer a unified view across devices. Components include Pie charts, Bar charts, Smoothline charts, Stockline charts, Scatterplots, Tree graphs and Radar graphs. Since Paths-Js makes no assumptions about rendering, this library is perfect for using SVG path objects to render custom charts easily.

luma.gl - A JavaScript WebGL Framework for Data Visualization

  •    Javascript

luma.gl's provides efficient and easy-to-use WebGL2-based building blocks enabling high-performance GPU-based data visualizations and computations on your browser.See Examples and Documentation. Change Log.

f2 - ๐Ÿ“ฑ๐Ÿ“ˆAn elegant, interactive and flexible charting library for mobile.

  •    Javascript

F2 is born for mobile, developed for developers as well as designers. It is Html5 Canvas-based, and is also compatible with Node.js, Weex and React Native. Based on the grammar of graphics, F2 provides all the chart types you'll need. Our mobile design guidelines enable better user experience in mobile visualzation projects. Special thanks to Leland Wilkinson, the author of The Grammar Of Graphics, whose book served as the foundation for F2 and G2.