ngx-charts : Angular2 and D3js Charting Framework

ngx-charts : Angular2 and D3js Charting Framework

ngx-charts is unique because we don’t merely wrap d3, nor any other chart engine for that matter. It is using Angular to render and animate the SVG elements with all of its binding and speed goodness, and uses d3 for the excellent math functions, scales, axis and shape generators, etc. By having Angular do all of the rendering it opens us up to endless possibilities the Angular platform provides such as AoT, Universal, etc.

Features:

  • Autoscaling
  • Timeline Filtering
  • Line Interpolation
  • Configurable Axis Labels
  • Legends (Labels & Gradient)
  • Advanced Label Positioning
  • Real-time data support
  • Advanced Tooltips
  • Data point Event Handlers

Angular Rating Bar Directive : mdRatingBar

Angular Rating Bar Directive : mdRatingBar

mdRatingBar is an Angular rating bar directive for use with Angular Material.

Component & Style Library for Angular2 : ngx-ui

Component & Style Library for Angular2 : ngx-ui

ngx-ui is a component and style library for Angular2+ projects. It takes hints from Google’s Material and Microsoft’s Neon projects to create a unique dark design style.

Angular Google Static Maps Directive

Angular Google Static Maps Directive

A angular directive to embed Google Static Maps in AngularJS through a simple tag.

Angular SidebarJS : Mobile Sidenav in AngularJS

Angular SidebarJS : Mobile Sidenav in AngularJS

Angular SidebarJS is a directive to create mobile sidebar/sidenav experiance in angular.

Data Table crafted for Angular2 : ngx-datatable

Data Table crafted for Angular2 : ngx-datatable

ngx-datatable is an Angular component for presenting large and complex data. It has all the features you would expect from any other table but in a light package with no external dependencies. The table was designed to be extremely flexible and light; it doesn’t make any assumptions about your data or how you: filter, sort or page it.

Features:

  • Handle large data sets ( Virtual DOM )
  • Expressive Header and Cell Templates
  • Horizontal & Vertical Scrolling
  • Column Reordering & Resizing
  • Client/Serve side Pagination & Sorting
  • Intelligent Column Width Algorithms ( Force-fill & Flex-grow )
  • Integrated Pager
  • Cell & Row Selection ( Single, Multi, Keyboard, Checkbox )

Angular DateRange Picker in Paypal DatePicker Style

Angular DateRange Picker in Paypal DatePicker Style

This date range picker was heavily inspired by PayPal’s datepicker as seen on website.

ng-FitText.js : AngularJS Flexible Font Size Directive

ng-FitText.js : AngularJS Flexible Font Size Directive

ng-FitText.js makes font-sizes flexible. Use this AngularJS directive in your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.

Drag, Drop and Sorting Library for Angular2

Drag, Drop and Sorting Library for Angular2

Drag, Drop and Sorting Library for Angular2 and beyond!

Features:

  • Drag and Drop
  • Sorting
  • Events (drag, drop, over, out)
  • Nesting
  • Touch support
  • Templating

nvd3.js charts with AngularJs

nvd3.js charts with AngularJs

Angular.js Directives “are a way to teach HTML new tricks”. Directives are Angular’s way of extending HTML to create new elements and functionality.

Directives hide the complexity and code that is necessary to create d3.js, and nvd3.js charts, which makes adding charts to an Angular.js application quicker, and simpler than typical methods.