Skip to content

Latest commit

 

History

History

charts-react

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 
 
 
 
 
 
 

@visa/charts-react

This package bundles visa chart components web components and exports them as react components. We leverage stencil's react bindings in the creation of @visa/charts-react.


Installation Steps

  • Using npm
    $ npm i @visa/charts-react
    
  • Using yarn
    $ yarn add @visa/charts-react
    

Components with Ready status in this bundle


# Use VCC as react components

Step 1: Install yarn add @visa/charts-react

Step 2: Use component as any other React component

import { BarChart, VisaChartsDataTable } from '@visa/charts-react';
// OR, depending on your webpack or bundling approach you may need to pull each component directly
import { BarChart, DataTable as VisaChartsDataTable } from '@visa/charts-react/dist/components/visa-charts';

<BarChart
  mainTitle={'BarChart'}
  subTitle={'Vertical (default) bar chart example'}
  data={state.data}
  ordinalAccessor={'month'}
  valueAccessor={'value'}
  height={400}
  width={600}
/>;