CartesianChartPropsMixin

Wiki ▸ API ▸ Mixins ▸ CartesianChartPropsMixin

This mixin provides common properties for all Cartesian-style charts.

Available Properties

(All properties can be overridden by passing in the property to the top level call of any chart that implements the mixin.)

• axesColor - the fill color of the axes

  • Type: React.PropTypes.string
  • Default: '#000'

• colors - a function that generates a color to be used for a fill. This is often implemented as a d3 ordinal color scale

  • Type: React.PropTypes.func
  • Default: d3.scale.category20c()

• colorAccessor - this return value of function is passed into colors

  • Type: React.PropTypes.func

  • Default: (d, idx) => idx where d is the datum being operated on, and idx is the index in the array of datums

  • Example call:

    datumArray.map(function(d, idx) {
      var fill = props.colors(props.colorAccessor(d, idx));
      // pass fill to whatever you want to color, such as a line on a LineChart
    });

• data - this is the datum array, in the required format, that is passed into your chart

  • Type: React.propTypes.oneOfType([React.PropTypes.array, React.PropTypes.object])
  • Default: []