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

How to use the recharts.Bar 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 / components / elements / Chart / Chart.tsx View on Github external
////////////////////////

  // ResponsiveContainer, <- not implemented
  Area: recharts.Area,
  Legend: recharts.Legend,
  Tooltip: recharts.Tooltip,
  // Cell           <- not implemented
  // Text           <- not implemented
  // 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 //
  //////////////////////
github streamlit / streamlit / frontend / src / elements / Chart.js View on Github external
////////////////////////

  // ResponsiveContainer, <- not implemented
  Area              : recharts.Area,
  Legend            : recharts.Legend,
  Tooltip           : recharts.Tooltip,
  // Cell           <- not implemented
  // Text           <- not implemented
  // 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 //
  //////////////////////
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),
        _react2.default.createElement(_recharts.Bar, { dataKey: 'Average Daily Fire Incidents per Month, 2010-2016', fill: '#e34d77' })
      )
    ),
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 fiatjaf / trackingco.de / client / charts / Card.js View on Github external
render () {
    let colours = mergeColours(this.props.colours)

    return (
      h(R.ResponsiveContainer, {height: 200, width: '100%'}, [
        h(R.ComposedChart, {data: this.props.site.days}, [
          h(R.Bar, {
            dataKey: 's',
            fill: color(colours.bar1).lighten(0.2).string(),
            isAnimationActive: false
          }),
          h(R.Line, {
            dataKey: 'v',
            stroke: color(colours.line1).lighten(0.2).string(),
            type: 'monotone',
            strokeWidth: 3,
            dot: false,
            isAnimationActive: false
          })
        ])
      ])
    )
  }
github hackoregon / component-library / lib / er-components / HowWhenBusy / HowWhenBusy.js View on Github external
_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),
        _react2.default.createElement(_recharts.Bar, { dataKey: 'Average False Alarms per Hour, 2010-2016', fill: '#ed7690' })
      )
    )
  );
};
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' })
  );
};

recharts

React charts

GitHub
MIT
Latest version published 15 days ago

Package Health Score

97 / 100
Full package analysis

Popular recharts functions

Similar packages