Class: Piechart

#module:EsbmePlots.Piechart

new Piechart()

Piechart creates a new Piechart
Version:
  • 1.0
Author:
Source:
Example
var x = Piechart()
 .parent(d3.selectAll(".container"))
 .categories(["Boys","Girls"])
 .seriesNames(["blue","pink"])
 .margin("auto")
 .data([[30,26])
 .draw()

Extends

Methods

categories(valueopt)

Defines the category names to be printed on the x-axis

If value is specified, sets the categories.
If value is not specified, return the current categories
Parameters:
Name Type Attributes Description
value Array.<String> <optional>
Source:

className(valueopt)

Defines a class to be added to all DOM elements within the SVG

If value is specified, sets the class name.
If value is not specified, return the current set value
Parameters:
Name Type Attributes Default Description
value String <optional>
 random
Inherited From:
Source:

cornerRadius(valueopt)

Defines the corner radius of each pie

If value is specified, sets the value.
If value is not specified, returns the current value
Parameters:
Name Type Attributes Description
value Integer <optional>
Source:

data(valueopt)

Adds / Updates the data bound to the plot

If value is specified, sets the data.
If value is not specified, returns the currently bound data
Parameters:
Name Type Attributes Description
value Array <optional>
 Array with data
Inherited From:
Source:

drawData(canvas, dimensions)

Draws the piechart

Parameters:
Name Type Description
canvas D3Selection
dimensions Object Dimensions of the plot (margins etc)
Source:

duration(valueopt)

Defines the duration for transitions

If value is specified, sets the length of transitions (in ms).
If value is not specified, return the current set value
Parameters:
Name Type Attributes Default Description
value Integer <optional>
 300
Inherited From:
Source:

events(valueopt)

Defines custom event listeners

Not yet implemented
Parameters:
Name Type Attributes Description
value Object <optional>
 Key=>value of events to listen and responding callbacks
Inherited From:
Source:

finished()

Defines a callback to be called whenever transitions finish

Not yet implemented
Inherited From:
Source:

Defines the header to be printed above the plot

If value is specified, sets the plot header.
If value is not specified, return the current set value
Parameters:
Name Type Attributes Default Description
value String <optional>
 "EsbmePlot" Header
Inherited From:
Source:

height(valueopt)

Defines the total height of the SVG

If value is specified, sets the height.
If value is not specified, return the currentlt set height
Parameters:
Name Type Attributes Description
value Int <optional>
 height in px
Inherited From:
Source:

info(valueopt)

Defines extra info that is stored in the DOM

If value is specified, sets the info.
If value is not specified, return the current set value
Parameters:
Name Type Attributes Description
value Array.<Object> <optional>
 Must have the same format as data. Final elements can be any kind of object
Inherited From:
Source:

innerRadius(valueopt)

Defines the inner radius of the arcs to create a donut-chart

If value is specified, sets the value.
If value is not specified, returns the current value
Parameters:
Name Type Attributes Default Description
value Integer <optional>
 0
Source:

margin(valueopt)

Defines the margin of the plot

Margin is used to print labels and axes, so it should either be set large enough or left to be determined automatically. If value is specified, sets the margins.
If value is not specified, return the current set value
Parameters:
Name Type Attributes Default Description
value Int | Array.<Int> | Object <optional>
 "auto" Margins in same format as with CSS
Inherited From:
Source:
Example
plot.margin(20)
=> {top: 20, right: 20, bottom: 20, left: 20}
plot.margin("auto")
=> {top: "auto", right: "auto", bottom: "auto", left: "auto"}
plot.margin(20,10)
=> {top: 20, right: 10, bottom: 20, left: 10}
plot.margin(5,10,15,20)
=> {top: 5, right: 10, bottom: 15, left: 20}
plot.margin({ top: 5, right: 10, bottom: 15, left: 20 })
=> {top: 5, right: 10, bottom: 15, left: 20}

parent(valueopt)

Defines or returns the parent DOM element onto which the svg will be appended

If value is specified, sets the parent.
If value is not specified, return the current set value
Parameters:
Name Type Attributes Description
value D3Selection <optional>
 d3.js Selection
Inherited From:
Source:

seriesNames(valueopt)

Defines the class names to be added to each series

If value is specified, sets the series names.
If value is not specified, return the current series names
Parameters:
Name Type Attributes Default Description
value Array.<String> <optional>
 ["Series1","Series2","Series3","Series4","Series5","Series6","Series7","Series8","Series9","Series10"]
Inherited From:
Source:

showCategories(valueopt)

Defines whether the names of the category should be written on each pie

If value is specified, sets the value.
If value is not specified, returns the current value
Parameters:
Name Type Attributes Description
value Array.<String> <optional>
Source:

showValues(valueopt)

Defines if percentage, numbers or nothing should be written on each pie

If value is specified, sets showValues.
If value is not specified, return the current value
Parameters:
Name Type Attributes Default Description
value String <optional>
 "number" Can be either "number", "percent" or null
Source:

svg(valueopt)

Defines the svg element

This value should rarely be used for setting the svg element and mainly used as a getter If value is specified, sets the parent.
If value is not specified, return the current set value
Parameters:
Name Type Attributes Description
value D3Selection <optional>
Inherited From:
Source:

width(valueopt)

Defines the total width of the SVG

If value is specified, sets the width.
If value is not specified, return the currently set width
Parameters:
Name Type Attributes Description
value Int <optional>
 width in px
Inherited From:
Source:

xDomain(valueopt)

Defines the domain for the X-axis

If value is specified, sets the x-axis domain.
If value is not specified, return the current set value
Parameters:
Name Type Attributes Description
value String <optional>
Inherited From:
Source:

xLabel(valueopt)

Defines the label to be printed below the X-axis

If value is specified, sets the x-axis label.
If value is not specified, return the current set value
Parameters:
Name Type Attributes Description
value String <optional>
Inherited From:
Source:

yDomain(valueopt)

Defines the domain for the y-axis

If value is specified, sets the y-axis domain.
If value is not specified, return the current set value
Parameters:
Name Type Attributes Description
value String <optional>
Inherited From:
Source:

yLabel(valueopt)

Defines the label to be printed alongside the Y-axis

If value is specified, sets the y-axis label.
If value is not specified, return the current set value
Parameters:
Name Type Attributes Description
value String <optional>
Inherited From:
Source: