1. Advisor
  2. recharts
  3. functions
  4. recharts.CartesianGrid
View all recharts analysis

How to use the recharts.CartesianGrid function in recharts

To help you get started, we’ve selected a few recharts examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github streamlit / streamlit / frontend / src / elements / Chart.js View on Github external
// Label          <- not implemented
  // LabelList      <- not implemented

  //////////////////////////
  // Cartesian Components //
  //////////////////////////

  Bar               : recharts.Bar,
  Line              : recharts.Line,
  Scatter           : recharts.Scatter,
  XAxis             : recharts.XAxis,
  YAxis             : recharts.YAxis,
  ZAxis             : recharts.ZAxis,
  Brush             : recharts.Brush,
  CartesianAxis     : recharts.CartesianAxis,
  CartesianGrid     : recharts.CartesianGrid,
  ReferenceLine     : recharts.ReferenceLine,
  ReferenceDot      : recharts.ReferenceDot,
  ReferenceArea     : recharts.ReferenceArea,
  ErrorBar          : recharts.ErrorBar,

  //////////////////////
  // Polar Components //
  //////////////////////

  Pie               : recharts.Pie,
  Radar             : recharts.Radar,
  RadialBar         : recharts.RadialBar,
  PolarAngleAxis    : recharts.PolarAngleAxis,
  PolarGrid         : recharts.PolarGrid,
  PolarRadiusAxis   : recharts.PolarRadiusAxis,
github streamlit / streamlit / frontend / src / components / elements / Chart / Chart.tsx View on Github external
// Label          <- not implemented
  // LabelList      <- not implemented

  //////////////////////////
  // Cartesian Components //
  //////////////////////////

  Bar: recharts.Bar,
  Line: recharts.Line,
  Scatter: recharts.Scatter,
  XAxis: recharts.XAxis,
  YAxis: recharts.YAxis,
  ZAxis: recharts.ZAxis,
  Brush: recharts.Brush,
  CartesianAxis: recharts.CartesianAxis,
  CartesianGrid: recharts.CartesianGrid,
  ReferenceLine: recharts.ReferenceLine,
  ReferenceDot: recharts.ReferenceDot,
  ReferenceArea: recharts.ReferenceArea,
  ErrorBar: recharts.ErrorBar,

  //////////////////////
  // Polar Components //
  //////////////////////

  Pie: recharts.Pie,
  Radar: recharts.Radar,
  RadialBar: recharts.RadialBar,
  PolarAngleAxis: recharts.PolarAngleAxis,
  PolarGrid: recharts.PolarGrid,
  PolarRadiusAxis: recharts.PolarRadiusAxis,
github hackoregon / component-library / lib / er-components / ResponseTimeVaries / ResponseTimeVaries.js View on Github external
var Scatterplot = function Scatterplot() {
  return _react2.default.createElement(
    'div',
    { style: { display: 'flex', flexFlow: 'row wrap' } },
    _react2.default.createElement(
      _recharts.ResponsiveContainer,
      { width: '33.333%', aspect: '1' },
      _react2.default.createElement(
        _recharts.ScatterChart,
        null,
        _react2.default.createElement(_recharts.XAxis, { dataKey: 'fma_population_total', name: 'Population' }),
        _react2.default.createElement(_recharts.YAxis, { dataKey: 'median_response_time', name: 'Response Time', unit: 'min' }),
        _react2.default.createElement(_recharts.ZAxis, { dataKey: 'fma', name: 'Fire Management Area' }),
        _react2.default.createElement(_recharts.Scatter, { name: 'Response Time vs. FMA Population', data: _data2.default, fill: '#D7075F' }),
        _react2.default.createElement(_recharts.CartesianGrid, null),
        _react2.default.createElement(_recharts.Legend, null),
        _react2.default.createElement(_recharts.Tooltip, { cursor: { strokeDasharray: '3 3' } })
      )
    ),
    _react2.default.createElement(
      _recharts.ResponsiveContainer,
      { width: '33.333%', aspect: '1' },
      _react2.default.createElement(
        _recharts.ScatterChart,
        null,
        _react2.default.createElement(_recharts.XAxis, { dataKey: 'median_hh_income', name: 'Median Household Income', unit: '$' }),
        _react2.default.createElement(_recharts.YAxis, { dataKey: 'median_response_time', name: 'Response Time', unit: 'min' }),
        _react2.default.createElement(_recharts.ZAxis, { dataKey: 'fma', name: 'Fire Management Area' }),
        _react2.default.createElement(_recharts.Scatter, { name: 'Response Time vs FMA Median Income', data: _data2.default, fill: '#D7075F' }),
        _react2.default.createElement(_recharts.CartesianGrid, null),
        _react2.default.createElement(_recharts.Legend, null),
github hackoregon / civic / packages / component-library / lib / BarChart / BarChart.js View on Github external
var HorizontalBarChart = function HorizontalBarChart(_ref) {
  var data = _ref.data;
  return _react2.default.createElement(
    _recharts.BarChart,
    { layout: 'horizontal', width: 730, height: 250, data: data },
    _react2.default.createElement(_recharts.XAxis, { dataKey: 'name' }),
    _react2.default.createElement(_recharts.YAxis, null),
    _react2.default.createElement(_recharts.CartesianGrid, { strokeDasharray: '3 3' }),
    _react2.default.createElement(_recharts.Tooltip, null),
    _react2.default.createElement(_recharts.Legend, null),
    _react2.default.createElement(_recharts.Bar, { dataKey: 'x', fill: '#8884d8' }),
    _react2.default.createElement(_recharts.Bar, { dataKey: 'y', fill: '#82ca9d' })
  );
};
github hackoregon / component-library / lib / er-components / HowWhenBusy / HowWhenBusy.js View on Github external
_react2.default.createElement(_recharts.YAxis, null),
        _react2.default.createElement(_recharts.CartesianGrid, { strokeDasharray: '3 3' }),
        _react2.default.createElement(_recharts.Tooltip, null),
        _react2.default.createElement(_recharts.Legend, null),
        _react2.default.createElement(_recharts.Bar, { dataKey: 'Average Medical Incidents per Hour, 2010-2016', fill: '#D7075F' })
      )
    ),
    _react2.default.createElement(
      _recharts.ResponsiveContainer,
      { width: '33.333%', aspect: '1' },
      _react2.default.createElement(
        _recharts.BarChart,
        { layout: 'horizontal', data: dataHourFire },
        _react2.default.createElement(_recharts.XAxis, { dataKey: 'name' }),
        _react2.default.createElement(_recharts.YAxis, null),
        _react2.default.createElement(_recharts.CartesianGrid, { strokeDasharray: '3 3' }),
        _react2.default.createElement(_recharts.Tooltip, null),
        _react2.default.createElement(_recharts.Legend, null),
        _react2.default.createElement(_recharts.Bar, { dataKey: 'Average Fire Incidents per Hour, 2010-2016', fill: '#e34d77' })
      )
    ),
    _react2.default.createElement(
      _recharts.ResponsiveContainer,
      { width: '33.333%', aspect: '1' },
      _react2.default.createElement(
        _recharts.BarChart,
        { layout: 'horizontal', data: dataHourFalse },
        _react2.default.createElement(_recharts.XAxis, { dataKey: 'name' }),
        _react2.default.createElement(_recharts.YAxis, null),
        _react2.default.createElement(_recharts.CartesianGrid, { strokeDasharray: '3 3' }),
        _react2.default.createElement(_recharts.Tooltip, null),
        _react2.default.createElement(_recharts.Legend, null),
github hackoregon / component-library / lib / er-components / ResponseTimeVaries / ResponseTimeVaries.js View on Github external
_react2.default.createElement(_recharts.CartesianGrid, null),
        _react2.default.createElement(_recharts.Legend, null),
        _react2.default.createElement(_recharts.Tooltip, { cursor: { strokeDasharray: '3 3' } })
      )
    ),
    _react2.default.createElement(
      _recharts.ResponsiveContainer,
      { width: '33.333%', aspect: '1' },
      _react2.default.createElement(
        _recharts.ScatterChart,
        null,
        _react2.default.createElement(_recharts.XAxis, { dataKey: 'percent_non_white', name: 'Non-White', unit: '%' }),
        _react2.default.createElement(_recharts.YAxis, { dataKey: 'total_incidents_per_1000', name: 'Incidents Per Thousand' }),
        _react2.default.createElement(_recharts.ZAxis, { dataKey: 'fma', name: 'Fire Management Area' }),
        _react2.default.createElement(_recharts.Scatter, { name: 'Incidents Per Thousand vs FMA % Non-White', data: _data2.default, fill: '#D7075F' }),
        _react2.default.createElement(_recharts.CartesianGrid, null),
        _react2.default.createElement(_recharts.Legend, null),
        _react2.default.createElement(_recharts.Tooltip, { cursor: { strokeDasharray: '3 3' } })
      )
    )
  );
};
github hackoregon / component-library / lib / AreaChart / AreaChart.js View on Github external
return _react2.default.createElement(
    'div',
    { style: { display: 'flex', justifyContent: 'space-around', margin: 'auto' } },
    _react2.default.createElement(
      _recharts.AreaChart,
      { width: 730, height: 250, data: data },
      _react2.default.createElement(_recharts.Legend, { layout: 'vertical', iconType: 'square', verticalAlign: 'top', align: 'left' }),
      _react2.default.createElement(
        'defs',
        null,
        gradients
      ),
      _react2.default.createElement(_recharts.XAxis, { dataKey: 'name' }),
      _react2.default.createElement(_recharts.YAxis, null),
      _react2.default.createElement(_recharts.CartesianGrid, { strokeDasharray: '3 3' }),
      _react2.default.createElement(_recharts.Tooltip, null),
      lines
    )
  );
};
github hackoregon / component-library / lib / er-components / HowWhenBusy / HowWhenBusy.js View on Github external
var ErBarChart = function ErBarChart() {
  return _react2.default.createElement(
    'div',
    { style: { display: 'flex', flexFlow: 'row wrap' } },
    _react2.default.createElement(
      _recharts.ResponsiveContainer,
      { width: '33.333%', aspect: '1' },
      _react2.default.createElement(
        _recharts.BarChart,
        { layout: 'horizontal', data: dataMonthMedical },
        _react2.default.createElement(_recharts.XAxis, { dataKey: 'name' }),
        _react2.default.createElement(_recharts.YAxis, null),
        _react2.default.createElement(_recharts.CartesianGrid, { strokeDasharray: '3 3' }),
        _react2.default.createElement(_recharts.Tooltip, null),
        _react2.default.createElement(_recharts.Legend, null),
        _react2.default.createElement(_recharts.Bar, { dataKey: 'Average Daily Medical Incidents per Month, 2010-2016', fill: '#D7075F' })
      )
    ),
    _react2.default.createElement(
      _recharts.ResponsiveContainer,
      { width: '33.333%', aspect: '1' },
      _react2.default.createElement(
        _recharts.BarChart,
        { layout: 'horizontal', data: dataMonthFire },
        _react2.default.createElement(_recharts.XAxis, { dataKey: 'name' }),
        _react2.default.createElement(_recharts.YAxis, null),
        _react2.default.createElement(_recharts.CartesianGrid, { strokeDasharray: '3 3' }),
        _react2.default.createElement(_recharts.Tooltip, null),
        _react2.default.createElement(_recharts.Legend, null),

recharts

React charts

GitHub
MIT
Latest version published 9 days ago

Package Health Score

97 / 100
Full package analysis

Popular recharts functions

Similar packages