d2bChart Pie

# d2b.chartPie()

Constructs a new pie chart generator with the default settings.

When using the d2b-pie generator you can draw a pie chart onto each element in the selection.

# pie.advanced(context)

Render the pie chart(s) to the given context, which may be either a d3-selection of html containers (e.g. div) or a corresponding d3-transition.

Before applying the d2b-pie-chart generator, you should join the data to the selected element(s) using selection.data or selection.datum.

# Properties

This is a complete list of properties that may be supplied to the axis chart datum. Bold properties are required.

PropertyDetails
data.values
Array of pie values.

Type: array
Required: true
data.at
This specifies where the pie chart will reside within the chart frame. It can either be specified as a location descriptor or a center position computator.

Type: "top left", "top center", "top right", "center left", "center center", "center right", "bottom center", "bottom right", (width, height, radius) => number
Default: (width, height, radius) => { return { x: width / 2, y: height / 2 } }
Optional: true
data.color
Pie arc color accessor function.

Type: string, (data) => string
Default: d => colorGenerator(d.label)
Optional: true
data.cornerRadius
Corner radius of pie arcs in pixels.

Type: number
Default: 0
Optional: true
data.donutRatio
Ratio of the pie's inner radius to outer radius. Given as a decimal between 0 and 1.

Type: number
Default: 0
Optional: true
data.duration
The internal chart duration in miliseconds.

Type: number
Default: 250
Optional: true
data.endAngle
Pie chart end angle in radians.

Type: number
Default: 2 * Math.PI
Optional: true
data.padAngle
Pie chart angle padding in radians.

Type: number
Default: 0
Optional: true
data.radius
Pie chart outer radius computator. Usually relative to the container height and width.

Type: (width, height) => number
Default: (width, height) => Math.min(width, height) / 2
Optional: true
data.sort
Pie arc sort comparator. Use null to order arcs according to the values array.

Type: null, (a, b) => number
Default: null
Optional: true
data.startAngle
Pie chart start angle in radians.

Type: number
Default: 0
Optional: true
data.updated
Event hook for d2b charts. Will be after the chart is rendered. Note: Transitions may still occur after this lifecycle hook fires.

Type: (this, data) => void
Optional: true
data.chartPadding
The chart's inner padding (excluding the legend) in pixels.

Type: number, object
Default: 10
Optional: true
data.legend
Chart legend configuration options.

Type: object
Optional: true
data.padding
The chart's outer padding (including the legend) in pixels.

Type: number, object
Default: 10
Optional: true
data.size
The pixel size of the chart.

Type: object
Optional: true
data.tooltip
Chart tooltip configuration options.

Type: object
Optional: true

results matching ""

    No results matching ""