Vue.D3.sunburst - Vue sunburst component based on D3.js

  •        10

Vue.D3.Sunburst provides a reusable vue sunburst charts component relying on D3.js. Sunburst is the main component of this library and display sunburst chart based on data props using children property for hierarchy, name property for naming and size property for arcs size.

https://github.com/David-Desmaisons/Vue.D3.sunburst

Dependencies:

d3-hierarchy : ^1.1.6
d3-interpolate : ^1.2.0
d3-scale : ^2.1.0
d3-scale-chromatic : ^1.3.0
d3-selection : ^1.3.0
d3-shape : ^1.2.0
d3-transition : ^1.1.1
vue : ^2.5.16
vue-resize-directive : ^1.1.4

Tags
Implementation
License
Platform

   




Related Projects

space-radar - Disk And Memory Space Visualization App built with Electron & d3.js

  •    Javascript

SpaceRadar allows interactive visualization of disk space and memory. It currently supports Sunburst, Treemap, and Flamegraph charts. Compressed files can be read directly. To detect them, the file name has to end with .gz.

Vue.D3.tree - Vue component to display tree based on D3.js layout.

  •    Vue

Update documentationVue components to display graphics based on D3.js layout. For all these events, the argument passed is {element, data} where element represents the node build by D3.js and data is the node raw data.

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.

d3-timeline - A simple D3 Timeline chart

  •    Javascript

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.

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.


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.

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.

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.

d3-extended - Extends D3 with some common jQuery functions and more

  •    Javascript

d3 Extended is compatible with d3 v4. If you are looking for the v3 compatible module you can find it on the v3 branch. This module extends d3-selection with helpful functions which are similar to the jQuery API. If you want to get to know more about this project, feel free to read the blog post: Replacing jQuery with d3.

vue-echarts-v3 - Vue.js(v2.x+) component wrap for ECharts.js(v3.x+)

  •    Javascript

Optional; CSS style is { width: 100%; height: 100%; } by default. Optional; Used to initialize ECharts instance.

vue-highcharts - :bar_chart: Highcharts component for Vue

  •    Javascript

Highcharts component for Vue. If you want to use Highstock, Highmaps or any other add-ons, you should pass in the Highcharts object which included the corresponding modules.

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.

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.

awesome-d3 - A list of D3 libraries, plugins and utilities

  •    

This list keeps track of interesting D3js libraries, plugins and utilities. We decided not to list tutorials, resources or concepts here, because there is already a very good list of readings out there you can check out and contribute to. You can also explore the list with our interactive D3 Discovery tool.

d3js_doc - D3js中文文档 D3中文 :bar_chart: :chart_with_upwards_trend: :tada:

  •    HTML

Released March 22, 2018. D3 5.0 引入了很少的非向后兼容的改变.

vue-typer - Vue component that simulates a user typing, selecting, and erasing text.

  •    Vue

Vue component that simulates a user typing, selecting, and erasing text. Play with vue-typer in this interactive demo. VueTyper has a single dependency to lodash.split to support emojis and other multi-codepoint Unicode characters. Apart from this, VueTyper does not have any direct dependencies to any other library or framework -- not even to Vue itself! All required Vue API calls are made through Vue's this.$* context methods. This means VueTyper can only execute within a Vue application context, but in exchange, it does not need to pull in Vue, which keeps VueTyper lightweight.