d3-timeline - A simple D3 Timeline chart

  •        703

This allows you to define a minimum width for an interval element. Sometimes, when you zoom out too much you might still want to be able to visualize the interval. It defaults to 8.

https://github.com/commodityvectors/d3-timeline

Tags
Implementation
License
Platform

   




Related Projects

d3-timeline - Simple JS timeline plugin for d3

  •    Javascript

#d3-timeline A simple d3 timeline plugin. Works with circles. In case the rectangular edges are too pointy.

reaviz - 📊 Data visualization library for React based on D3

  •    TypeScript

REAVIZ is a modular chart component library that leverages React natively for rendering the components while using D3js under the hood for calculations. The library provides an easy way to get started creating charts without sacrificing customization ability.

reaviz - 📊 Data visualization library for React based on D3

  •    TypeScript

REAVIZ is a modular chart component library that leverages React natively for rendering the components while using D3js under the hood for calculations. The library provides an easy way to get started creating charts without sacrificing customization ability. If you are looking for node-based graphs, checkout reaflow.

vis-timeline - 📈 Create a fully customizable, interactive timelines and 2d-graphs with items and ranges

  •    Javascript

The Timeline/Graph2D is an interactive visualization chart to visualize data in time. The data items can take place on a single date, or have a start and end date (a range). You can freely move and zoom in the timeline by dragging and scrolling in the Timeline. Items can be created, edited, and deleted in the timeline. The time scale on the axis is adjusted automatically, and supports scales ranging from milliseconds to years. A basic example on loading a Timeline is shown below. More examples can be found in the examples directory of the project.

gantt - Javascript Gantt chart

  •    Javascript

dhtmlxGantt is an open source JavaScript Gantt chart that helps you illustrate a project schedule in a nice-looking chart. It can show the dependencies between tasks as lines and allows you to set up different relationships between tasks (finish-to-start, start-to-start, end-to-end). dhtmlxGantt provides flexible API and a large number of event handles, which gives you the freedom to customize it for your needs.


Gantt-Chart - Gantt chart library using D3.js.

  •    Java

A basic implementation of a Gantt Chart using D3.js. Here is an example [Example 1] (http://bl.ocks.org/dk8996/5534835) and another one [Example 2] (http://bl.ocks.org/dk8996/5449641). Here is an [example] (http://static.mentful.com/d3ganttchart/example.html) of loading external data, in JSON format, into the Gantt Chart, you need to watch out for [cross-domain restrictions] (http://en.wikipedia.org/wiki/Same-origin_policy).

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.

d3kit-timeline - A simple timeline component that labels do not overlap.

  •    Javascript

If you want to have a simple timeline that labels do not overlap, but too lazy to implement one from scratch, this library is for you. Below is a screenshot of four timelines of the same data, each can be created via ~10 lines of code. See demo. The use case of this library is not limited to temporal data. You can change the scale to be d3.scale.linear() or something else to support x-value that is not time.

ember-timetree - Visualize hierarchical timeline data. Built with Ember.js and D3.js

  •    Javascript

##As this component is no longer in development inside Crowdstrike we are providing this code for illustrative purposes only. Please feel free to use and fork but be aware we will no longer be updating this repository to support newer versions of Ember or fixing issues. Visualize hierarchical timeline data. Built with Ember.js and D3.js.

d3fc - A collection of components that make it easy to build interactive charts with D3

  •    HTML

A collection of components that make it easy to build interactive charts with D3. This project has recently upgraded to D3 version 5 to take advantage of the new promise-based API, and stays compatible with D3 version 4 for all other functionality. For more details, see the release notes for D3 version 5.0 and d3fc v14.0.0.

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.

radar-chart-d3 - Simple radar chart in D3.js

  •    Javascript

A reusable radar chart implementation in D3.js. Styleable, configurable and transition-capable. xOffset and yOffset are optional values that allows a developer to change the position of a specific label. It is important to add them in the first group of axes.

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.

Timeline Control

  •    WPF

Timeline control fill a missing part in WPF toolbox. It allow you to show visual representation of data on visual timeline such as present in MS Project application. TimelineControl is highly customizable using DataTemplate and Style and is 100% C# WPF managed code.

d3.compose - Compose complex, data-driven visualizations from reusable charts and components with d3

  •    Javascript

Compose rich, data-bound charts from charts (like Lines and Bars) and components (like Axis, Title, and Legend) with d3 and d3.chart. See http://CSNW.github.io/d3.compose/ for live examples and docs.

Recharts - Redefined chart library built with React and D3

  •    Javascript

Recharts is a Redefined chart library built with React and D3. It can be easily deployed with React components. It has SVG support, lightweight depending only on some D3 submodules. All the components of Recharts are clearly separated.

line-chart - Awesome charts for AngularJS.

  •    TypeScript

n3-line-chart is an easy-to-use JavaScript library for creating beautiful charts in AngularJS applications and it is built on top of D3.js.Please note: Currently, n3-line-chart works only with D3.js version 3! In D3.js version 4, the API changed and hence breaks compatibility with many 3rd party libaries such as n3-line-chart.






We have large collection of open source products. Follow the tags from Tag Cloud >>


Open source products are scattered around the web. Please provide information about the open source projects you own / you use. Add Projects.