Class JXG.Chart
JXG.GeometryElement
↳ JXG.Chart
Creates a new basic chart object. Do not use this constructor to create a chart.
Use JXG.Board#create with type Chart instead.
Defined in: chart.js.
Extends
JXG.GeometryElement.
| Constructor Attributes | Constructor Name and Description |
|---|---|
|
JXG.Chart(board, parent, attributes)
The Chart class is a basic class for the chart object.
|
- Fields borrowed from class JXG.GeometryElement:
- _org_type, _pos, ancestors, baseElement, board, childElements, dash, dashScale, descendants, draft, dragToTopOfLayer, dump, elementClass, elType, fillColor, fillOpacity, fixed, frozen, gradient, gradientAngle, gradientCX, gradientCY, gradientEndOffset, gradientFR, gradientFX, gradientFY, gradientR, gradientSecondColor, gradientSecondOpacity, gradientStartOffset, hasLabel, highlight, highlighted, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, id, inherits, isDraggable, isLabel, isReal, lastDragTime, layer, lineCap, methodMap, mouseover, name, needsRegularUpdate, needsUpdate, nonnegativeOnly, notExistingParents, numTraces, parents, precision, priv, quadraticform, rendNode, rotatable, scalable, shadow, snapToGrid, stdform, strokeColor, strokeOpacity, strokeWidth, subs, symbolic, tabindex, trace, traceAttributes, traces, transformations, transitionDuration, transitionProperties, type, viewport, visible, visProp, visPropCalc, withLabel
| Field Attributes | Field Name and Description |
|---|---|
|
Contains pointers to the various subelements of the chart.
|
- Fields borrowed from class JXG.GeometryElement:
- _org_type, _pos, ancestors, baseElement, board, childElements, dash, dashScale, descendants, draft, dragToTopOfLayer, dump, elementClass, elType, fillColor, fillOpacity, fixed, frozen, gradient, gradientAngle, gradientCX, gradientCY, gradientEndOffset, gradientFR, gradientFX, gradientFY, gradientR, gradientSecondColor, gradientSecondOpacity, gradientStartOffset, hasLabel, highlight, highlighted, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, id, inherits, isDraggable, isLabel, isReal, lastDragTime, layer, lineCap, methodMap, mouseover, name, needsRegularUpdate, needsUpdate, nonnegativeOnly, notExistingParents, numTraces, parents, precision, priv, quadraticform, rendNode, rotatable, scalable, shadow, snapToGrid, stdform, strokeColor, strokeOpacity, strokeWidth, subs, symbolic, tabindex, trace, traceAttributes, traces, transformations, transitionDuration, transitionProperties, type, viewport, visible, visProp, visPropCalc, withLabel
| Method Attributes | Method Name and Description |
|---|---|
|
drawBar(board, x, y, attributes)
Create bar chart defined by two data arrays.
|
|
|
drawFit(board, x, y, attributes)
Create line chart where the curve is given by a regression polynomial
defined by two data arrays.
|
|
|
drawLine(board, x, y, attributes)
Create line chart defined by two data arrays.
|
|
|
drawPie(board, y, attributes)
Create pie chart.
|
|
|
drawPoints(board, x, y, attributes)
Create chart consisting of JSXGraph points.
|
|
|
drawRadar(board, parents, attributes)
Create radar chart.
|
|
|
drawSpline(board, x, y, attributes)
Create line chart that consists of a natural spline curve
defined by two data arrays.
|
|
|
Template for dynamic charts update.
|
|
| <private> |
Uses the boards renderer to update the chart.
|
- Methods borrowed from class JXG.GeometryElement:
- _set, addChild, addDescendants, addParents, addParentsFromJCFunctions, addRotation, addTicks, addTransform, animate, bounds, clearTrace, cloneToBackground, countChildren, createGradient, createLabel, draggable, formatNumberLocale, fullUpdate, generatePolynomial, getAttribute, getAttributes, getLabelAnchor, getName, getParents, getProperty, getSnapSizes, getTextAnchor, getType, handleSnapToGrid, hasPoint, hide, hideElement, noHighlight, normalize, prepareUpdate, remove, removeAllTicks, removeChild, removeDescendants, removeTicks, resolveShortcuts, setArrow, setAttribute, setDash, setDisplayRendNode, setLabel, setLabelText, setName, setParents, setPosition, setPositionDirectly, setProperty, show, showElement, snapToPoints, update, updateVisibility, useLocale
- Events borrowed from class JXG.GeometryElement:
- attribute, attribute:key, down, drag, keydrag, mousedown, mousedrag, mousemove, mouseout, mouseover, mouseup, move, out, over, pendown, pendrag, penup, touchdown, touchdrag, touchup, up
Class Detail
JXG.Chart(board, parent, attributes)
The Chart class is a basic class for the chart object.
- Parameters:
- {String|JXG.Board} board
- The board the new chart is drawn on.
- {Array} parent
- data arrays for the chart
- {Object} attributes
- Javascript object containing attributes like name, id and colors.
Field Detail
elements
Contains pointers to the various subelements of the chart.
Method Detail
{Array}
drawBar(board, x, y, attributes)
Create bar chart defined by two data arrays.
Attributes to change the layout of the bar chart are:
- width (optional)
- dir: 'horizontal' or 'vertical'
- colors: array of colors
- labels: array of labels
- Parameters:
- {String|JXG.Board} board
- The board the chart is drawn on
- {Array} x
- Array of x-coordinates
- {Array} y
- Array of y-coordinates
- {Object} attributes
- Javascript object containing attributes like colors
- Returns:
- {Array} Array of JXG polygons defining the bars
{JXG.Curve}
drawFit(board, x, y, attributes)
Create line chart where the curve is given by a regression polynomial
defined by two data arrays. The degree of the polynomial is supplied
through the attribute "degree" in attributes.
- Parameters:
- {String|JXG.Board} board
- The board the chart is drawn on
- {Array} x
- Array of x-coordinates
- {Array} y
- Array of y-coordinates
- {Object} attributes
- Javascript object containing attributes like colors
- Returns:
- {JXG.Curve} JSXGraph function graph object
{JXG.Curve}
drawLine(board, x, y, attributes)
Create line chart defined by two data arrays.
- Parameters:
- {String|JXG.Board} board
- The board the chart is drawn on
- {Array} x
- Array of x-coordinates
- {Array} y
- Array of y-coordinates
- {Object} attributes
- Javascript object containing attributes like colors
- Returns:
- {JXG.Curve} JSXGraph curve
{Object}
drawPie(board, y, attributes)
Create pie chart.
Attributes to change the layout of the pie chart are:
- labels: array of labels
- colors: (Array)
- highlightColors (Array)
- radius
- center (coordinate array)
- highlightOnSector (Boolean)
- Parameters:
- {String|JXG.Board} board
- The board the chart is drawn on
- {Array} y
- Array of x-coordinates
- {Object} attributes
- Javascript object containing attributes like colors
- Returns:
- {Object} with keys: "{sectors, points, midpoint}"
{Array}
drawPoints(board, x, y, attributes)
Create chart consisting of JSXGraph points.
Attributes to change the layout of the point chart are:
- fixed (Boolean)
- infoboxArray (Array): Texts for the infobox
- Parameters:
- {String|JXG.Board} board
- The board the chart is drawn on
- {Array} x
- Array of x-coordinates
- {Array} y
- Array of y-coordinates
- {Object} attributes
- Javascript object containing attributes like colors
- Returns:
- {Array} Array of JSXGraph points
{Object}
drawRadar(board, parents, attributes)
Create radar chart.
Attributes to change the layout of the pie chart are:
- paramArray: labels for axes, [ paramx, paramy, paramz ]
- startShiftRatio: 0 <= offset from chart center <=1
- endShiftRatio: 0 <= offset from chart radius <=1
- startShiftArray: Adjust offsets per each axis
- endShiftArray: Adjust offsets per each axis
- startArray: Values for inner circle. Default values: minimums
- start: one value to overwrite all startArray values
- endArray: Values for outer circle, maximums by default
- end: one value to overwrite all endArray values
- labelArray
- polyStrokeWidth
- colors
- highlightcolors
- labelArray: [ row1, row2, row3 ]
- radius
- legendPosition
- showCircles
- circleLabelArray
- circleStrokeWidth
- Parameters:
- {String|JXG.Board} board
- The board the chart is drawn on
- {Array} parents
- Array of coordinates, e.g. [[x1, y1, z1], [x2, y2, z2], [x3, y3, z3]]
- {Object} attributes
- Javascript object containing attributes like colors
- Returns:
- {Object} with keys "{circles, lines, points, midpoint, polygons}"
{JXG.Curve}
drawSpline(board, x, y, attributes)
Create line chart that consists of a natural spline curve
defined by two data arrays.
- Parameters:
- {String|JXG.Board} board
- The board the chart is drawn on
- {Array} x
- Array of x-coordinates
- {Array} y
- Array of y-coordinates
- {Object} attributes
- Javascript object containing attributes like colors
- Returns:
- {JXG.Curve} JSXGraph (natural) spline curve
{JXG.Chart}
updateDataArray()
Template for dynamic charts update.
This method is used to compute new entries
for the arrays this.dataX and
this.dataY. It is used in update.
Default is an empty method, can be overwritten
by the user.
- Returns:
- {JXG.Chart} Reference to this chart object.
<private>
updateRenderer()
Uses the boards renderer to update the chart.