com.codename1.charts

Class ChartComponent

java.lang.Object

com.codename1.ui.Component

com.codename1.charts.ChartComponent

All Implemented Interfaces:

Animation, Editable, StyleListener

public class ChartComponent
extends Component

The top level component for displaying charts

The charts package enables Codename One developers to add charts and visualizations to their apps without having to include external libraries or embedding web views. We also wanted to harness the new features in the graphics pipeline to maximize performance.

Features

1. Built-in support for many common types of charts including bar charts, line charts, stacked charts, scatter charts, pie charts and more.
2. Pinch Zoom - The com.codename1.charts,ChartComponent class includes optional pinch zoom support.
3. Panning Support - The com.codename1.charts,ChartComponent class includes optional support for panning.

Chart Types

The com.codename1.charts package includes models and renderers for many different types of charts. It is also extensible so that you can add your own chart types if required. The following screen shots demonstrate a small sampling of the types of charts that can be created.

*

The above screenshots were taken from the ChartsDemo app. Y ou can start playing with this app by checking it out from our git repository.

How to Create A Chart

Adding a chart to your app involves four steps:

1. Build the model. You can construct a model (aka data set) for the chart using one of the existing model classes in the com.codename1.charts.models package. Essentially, this is just where you add the data that you want to display.
2. Set up a renderer. You can create a renderer for your chart using one of the existing renderer classes in the com.codename1.charts.renderers package. The renderer allows you to specify how the chart should look. E.g. the colors, fonts, styles, to use.
3. Create the Chart View. Use one of the existing view classes in the com.codename1.charts.views package.
4. Create a com.codename1.charts,ChartComponent . In order to add your chart to the UI, you need to wrap it in a com.codename1.charts,ChartComponent object.

You can check out the ChartsDemo app for specific examples, but here is a high level view of some code that creates a Pie Chart.

The charts package is derived work from the excellent open source aChartEngine API.

Field Summary

Fields inherited from class com.codename1.ui.Component

BASELINE, BOTTOM, BRB_CENTER_OFFSET, BRB_CONSTANT_ASCENT, BRB_CONSTANT_DESCENT, BRB_OTHER, CENTER, CROSSHAIR_CURSOR, DEFAULT_CURSOR, DRAG_REGION_IMMEDIATELY_DRAG_X, DRAG_REGION_IMMEDIATELY_DRAG_XY, DRAG_REGION_IMMEDIATELY_DRAG_Y, DRAG_REGION_LIKELY_DRAG_X, DRAG_REGION_LIKELY_DRAG_XY, DRAG_REGION_LIKELY_DRAG_Y, DRAG_REGION_NOT_DRAGGABLE, DRAG_REGION_POSSIBLE_DRAG_X, DRAG_REGION_POSSIBLE_DRAG_XY, DRAG_REGION_POSSIBLE_DRAG_Y, E_RESIZE_CURSOR, HAND_CURSOR, LEFT, MOVE_CURSOR, N_RESIZE_CURSOR, NE_RESIZE_CURSOR, NW_RESIZE_CURSOR, RIGHT, S_RESIZE_CURSOR, SE_RESIZE_CURSOR, SW_RESIZE_CURSOR, TEXT_CURSOR, TOP, W_RESIZE_CURSOR, WAIT_CURSOR

Constructor Summary

Constructors

Constructor and Description
ChartComponent(AbstractChart chart) Creates a new chart component to display the provided chart.

Method Summary

Modifier and Type	Method and Description
protected Dimension	calcPreferredSize() Calculates the preferred size based on component content.
protected void	chartBoundsChanged() Subclasses can override this method to be informed when the chart bounds change due to panning or zooming.
Point	chartToScreenCoord(int x, int y) Returns the screen position from a chart coordinate
Shape	chartToScreenShape(Shape s) Converts a screen coordinate spaced shape to the same shape in the chart coordinate space
void	clearPanLimits() Removes the pan limits which may have been previously set with setPanLimits(double, double, double, double)
AbstractChart	getChart() Gets the chart that is being displayed in this component.
Transform	getTransform() Gets the transform for the chart.
boolean	isPanEnabled() Checks if panning is enabled.
boolean	isPanXEnabled() Checks whether panning is enabled along the X-axis.
boolean	isPanYEnabled() Checks whether panning is enabled along the Y-axis.
boolean	isZoomEnabled() Checks whether zoom is enabled.
boolean	isZoomXEnabled() Checks whether zoom is enabled on the X-axis.
boolean	isZoomYEnabled() Checks whether zoom is enabled on the Y-axis.
void	paint(Graphics g) Paints the chart.
void	pointerDragged(int[] x, int[] y) If this Component is focused, the pointer dragged event will call this method
void	pointerPressed(int x, int y) If this Component is focused, the pointer pressed event will call this method
void	pointerReleased(int x, int y) If this Component is focused, the pointer released event will call this method
Point	screenToChartCoord(int x, int y) Converts screen coordinates to chart coordinates.
Shape	screenToChartShape(Shape s) Converts a chart coordinate spaced shape to the same shape in the screen coordinate space
protected void	seriesPressed(SeriesSelection sel) Called when a pointer is pressed on a series in the chart.
protected void	seriesReleased(SeriesSelection sel) Called when a pointer is released from a series in the chart.
void	setChart(AbstractChart chart) Sets the chart to be displayed in this component.
void	setPanEnabled(boolean panEnabled)
void	setPanEnabled(boolean panXEnabled, boolean panYEnabled) Enables or disables pan on x and y axes separately.
void	setPanLimits(double minX, double maxX, double minY, double maxY) Sets the pan limits if panning is enabled.
void	setTransform(Transform transform) Sets the transform for the chart.
void	setZoomEnabled(boolean zoomEnabled) Enables or disables zoom on both x and y axes.
void	setZoomEnabled(boolean zoomX, boolean zoomY) Enables or disables zoom on x and y axes separately.
void	setZoomLimits(double minRangeX, double maxRangeX, double minRangeY, double maxRangeY) Sets the zoom limits.
void	zoomTo(double minX, double maxX, double minY, double maxY, int duration) Zooms the chart in an animated fashion to the specified axis ranges.
void	zoomToShapeInChartCoords(Shape s) Zooms the view port to show a specified shape.
void	zoomToShapeInChartCoords(Shape s, int duration) Zooms the view port to show a specified shape.

Methods inherited from class com.codename1.ui.Component

addDragFinishedListener, addDragOverListener, addDropListener, addFocusListener, addLongPressListener, addPointerDraggedListener, addPointerPressedListener, addPointerReleasedListener, addPullToRefresh, addScrollListener, addStateChangeListener, animate, bindProperty, blocksSideSwipe, calcScrollSize, cancelRepaints, clearClientProperties, contains, containsOrOwns, createStyleAnimation, deinitialize, deinitializeCustomStyle, dragEnter, dragExit, dragFinished, draggingOver, dragInitiated, drawDraggedImage, drop, fireClicked, focusGained, focusLost, getAbsoluteX, getAbsoluteY, getAllStyles, getAnimationManager, getBaseline, getBaselineResizeBehavior, getBindablePropertyNames, getBindablePropertyTypes, getBorder, getBottomGap, getBoundPropertyValue, getBounds, getBounds, getClientProperty, getCloudBoundProperty, getCloudDestinationProperty, getComponentForm, getComponentState, getCursor, getDefaultDragTransparency, getDirtyRegion, getDisabledStyle, getDraggedx, getDraggedy, getDragImage, getDragRegionStatus, getDragSpeed, getDragTransparency, getEditingDelegate, getGridPosX, getGridPosY, getHeight, getInlineAllStyles, getInlineDisabledStyles, getInlinePressedStyles, getInlineSelectedStyles, getInlineStylesTheme, getInlineUnselectedStyles, getInnerHeight, getInnerPreferredH, getInnerPreferredW, getInnerWidth, getInnerX, getInnerY, getLabelForComponent, getName, getNativeOverlay, getNextFocusDown, getNextFocusLeft, getNextFocusRight, getNextFocusUp, getOuterHeight, getOuterPreferredH, getOuterPreferredW, getOuterWidth, getOuterX, getOuterY, getOwner, getParent, getPreferredH, getPreferredSize, getPreferredSizeStr, getPreferredTabIndex, getPreferredW, getPressedStyle, getPropertyNames, getPropertyTypeNames, getPropertyTypes, getPropertyValue, getSameHeight, getSameWidth, getScrollable, getScrollAnimationSpeed, getScrollDimension, getScrollOpacity, getScrollOpacityChangeSpeed, getScrollX, getScrollY, getSelectCommandText, getSelectedRect, getSelectedStyle, getSideGap, getStyle, getTabIndex, getTensileLength, getTextSelectionSupport, getTooltip, getUIID, getUIManager, getUnselectedStyle, getVisibleBounds, getVisibleBounds, getWidth, getX, getY, growShrink, handlesInput, hasFixedPreferredSize, hasFocus, hideNativeOverlay, initComponent, initCustomStyle, initDisabledStyle, initLaf, initPressedStyle, initSelectedStyle, initUnselectedStyle, installDefaultPainter, isAlwaysTensile, isBlockLead, isCellRenderer, isChildOf, isDragActivated, isDragAndDropOperation, isDraggable, isDragRegion, isDropTarget, isEditable, isEditing, isEnabled, isFlatten, isFocusable, isGrabsPointerEvents, isHidden, isHidden, isHideInLandscape, isHideInPortrait, isIgnorePointerEvents, isInClippingRegion, isInitialized, isOpaque, isOwnedBy, isPinchBlocksDragAndDrop, isRippleEffect, isRTL, isScrollable, isScrollableX, isScrollableY, isScrollVisible, isSelectableInteraction, isSetCursorSupported, isSmoothScrolling, isSnapToGrid, isStickyDrag, isTactileTouch, isTactileTouch, isTensileDragEnabled, isTraversable, isVisible, keyPressed, keyReleased, keyRepeated, laidOut, longKeyPress, longPointerPress, onScrollX, onScrollY, paintBackground, paintBackgrounds, paintBorder, paintBorderBackground, paintComponent, paintComponent, paintIntersectingComponentsAbove, paintLock, paintLockRelease, paintRippleOverlay, paintScrollbars, paintScrollbarX, paintScrollbarY, paintShadows, paramString, parsePreferredSize, pinch, pinch, pinchReleased, pointerDragged, pointerHover, pointerHoverPressed, pointerHoverReleased, pointerPressed, pointerReleased, putClientProperty, refreshTheme, refreshTheme, refreshTheme, remove, removeDragFinishedListener, removeDragOverListener, removeDropListener, removeFocusListener, removeLongPressListener, removePointerDraggedListener, removePointerPressedListener, removePointerReleasedListener, removeScrollListener, removeStateChangeListener, repaint, repaint, requestFocus, resetFocusable, respondsToPointerEvents, scrollRectToVisible, scrollRectToVisible, setAlwaysTensile, setBlockLead, setBoundPropertyValue, setCellRenderer, setCloudBoundProperty, setCloudDestinationProperty, setComponentState, setCursor, setDefaultDragTransparency, setDirtyRegion, setDisabledStyle, setDraggable, setDragTransparency, setDropTarget, setEditingDelegate, setEnabled, setFlatten, setFocus, setFocusable, setGrabsPointerEvents, setHandlesInput, setHeight, setHidden, setHidden, setHideInLandscape, setHideInPortrait, setIgnorePointerEvents, setInitialized, setInlineAllStyles, setInlineDisabledStyles, setInlinePressedStyles, setInlineSelectedStyles, setInlineStylesTheme, setInlineUnselectedStyles, setIsScrollVisible, setLabelForComponent, setName, setNextFocusDown, setNextFocusLeft, setNextFocusRight, setNextFocusUp, setOpaque, setOwner, setPinchBlocksDragAndDrop, setPreferredH, setPreferredSize, setPreferredSizeStr, setPreferredTabIndex, setPreferredW, setPressedStyle, setPropertyValue, setRippleEffect, setRTL, setSameHeight, setSameSize, setSameWidth, setScrollAnimationSpeed, setScrollOpacityChangeSpeed, setScrollSize, setScrollVisible, setScrollX, setScrollY, setSelectCommandText, setSelectedStyle, setShouldCalcPreferredSize, setSize, setSmoothScrolling, setSnapToGrid, setTabIndex, setTactileTouch, setTensileDragEnabled, setTensileLength, setTooltip, setTraversable, setUIID, setUIID, setUnselectedStyle, setVisible, setWidth, setX, setY, shouldBlockSideSwipe, shouldBlockSideSwipeLeft, shouldBlockSideSwipeRight, shouldRenderComponentSelection, showNativeOverlay, startEditingAsync, stopEditing, stripMarginAndPadding, styleChanged, toImage, toString, unbindProperty, updateNativeOverlay, visibleBoundsContains

Methods inherited from class java.lang.Object

clone, equals, getClass, hashCode, notify, notifyAll, wait, wait, wait

Constructor Detail

ChartComponent

public ChartComponent(AbstractChart chart)

Creates a new chart component to display the provided chart.

Parameters:

chart - The chart to be displayed in this component.

Method Detail

getChart

public AbstractChart getChart()

Gets the chart that is being displayed in this component.

Returns:

calcPreferredSize

protected Dimension calcPreferredSize()

Description copied from class: Component

Calculates the preferred size based on component content. This method is invoked lazily by getPreferred size.

Overrides:

calcPreferredSize in class Component

Returns:

the calculated preferred size based on component content

setChart

public void setChart(AbstractChart chart)

Sets the chart to be displayed in this component.

Parameters:

chart -

paint

public void paint(Graphics g)

Paints the chart.

Specified by:

paint in interface Animation

Overrides:

paint in class Component

Parameters:

g -

screenToChartCoord

public Point screenToChartCoord(int x,
                                int y)

Converts screen coordinates to chart coordinates.

Parameters:

x - screen x position

y - screen y position

Returns:

The chart coordinate corresponding to the given screen coordinate.

chartToScreenCoord

public Point chartToScreenCoord(int x,
                                int y)

Returns the screen position from a chart coordinate

Parameters:

x - the x position within the chart

y - the y position within the chart

Returns:

a position within the screen

screenToChartShape

public Shape screenToChartShape(Shape s)

Converts a chart coordinate spaced shape to the same shape in the screen coordinate space

Parameters:

s - shape in screen coordinates

Returns:

same shape using chart space coordinates

chartToScreenShape

public Shape chartToScreenShape(Shape s)

Converts a screen coordinate spaced shape to the same shape in the chart coordinate space

Parameters:

s - shape in chart coordinates

Returns:

same shape using screen coordinate space

zoomToShapeInChartCoords

public void zoomToShapeInChartCoords(Shape s)

Zooms the view port to show a specified shape. The shape should be expressed in chart coordinates (not screen coordinates).

Parameters:

s - The shape that should be shown.

zoomToShapeInChartCoords

public void zoomToShapeInChartCoords(Shape s,
                                     int duration)

Zooms the view port to show a specified shape. The shape should be expressed in chart coordinates (not screen coordinates).

Parameters:

s - The shape that should be shown.

duration - The duration of the transition.

See Also:

zoomTo(double, double, double, double, int)

zoomTo

public void zoomTo(double minX,
                   double maxX,
                   double minY,
                   double maxY,
                   int duration)

Zooms the chart in an animated fashion to the specified axis ranges. This is effectively the same as using zoomToShapeInChartCoords(com.codename1.ui.geom.Shape, int) except it allows you to specify coordinates as doubles.

Parameters:

minX - The lower bound of the X-axis after zoom.

maxX - The upper bound of the X-axis after zoom.

minY - The lower bound of the Y-axis after zoom.

maxY - THe upper bound of the Y-axis after zoom.

duration - Transition time (ms).

pointerPressed

public void pointerPressed(int x,
                           int y)

Description copied from class: Component

If this Component is focused, the pointer pressed event will call this method

Overrides:

pointerPressed in class Component

Parameters:

x - the pointer x coordinate

y - the pointer y coordinate

seriesPressed

protected void seriesPressed(SeriesSelection sel)

Called when a pointer is pressed on a series in the chart. This can be overridden by subclasses to respond to this event.

Parameters:

sel -

pointerReleased

public void pointerReleased(int x,
                            int y)

Description copied from class: Component

If this Component is focused, the pointer released event will call this method

Overrides:

pointerReleased in class Component

Parameters:

x - the pointer x coordinate

y - the pointer y coordinate

seriesReleased

protected void seriesReleased(SeriesSelection sel)

Called when a pointer is released from a series in the chart. This can be overridden in subclasses to handle these events.

Parameters:

sel -

getTransform

public Transform getTransform()

Gets the transform for the chart. This can be used to scale, translate, and rotate the chart. This transform assumes its origin at the (absoluteX, absoluteY) of the component at the time it is drawn rather than the screen's origin as is normally the case with transforms. This allows the transform to be applied consistently with respect to the chart's coordinates even when the component is moved around the screen.

Returns:

The transform for the chart in component coordinates.

setTransform

public void setTransform(Transform transform)

Sets the transform for the chart. Transforms origin assumed to be at (getAbsoluteX, getAbsoluteY).

Parameters:

transform - the transform to set

pointerDragged

public void pointerDragged(int[] x,
                           int[] y)

Description copied from class: Component

If this Component is focused, the pointer dragged event will call this method

Overrides:

pointerDragged in class Component

Parameters:

x - the pointer x coordinate

y - the pointer y coordinate

isPanEnabled

public boolean isPanEnabled()

Checks if panning is enabled.

Returns:

the panEnabled

setPanEnabled

public void setPanEnabled(boolean panEnabled)

Parameters:

panEnabled - the panEnabled to set

setPanEnabled

public void setPanEnabled(boolean panXEnabled,
                          boolean panYEnabled)

Enables or disables pan on x and y axes separately.

Parameters:

panXEnabled - True to enable panning along the x-axis.

panYEnabled - True to enable panning along the y-axis.

isPanXEnabled

public boolean isPanXEnabled()

Checks whether panning is enabled along the X-axis.

Returns:

isPanYEnabled

public boolean isPanYEnabled()

Checks whether panning is enabled along the Y-axis.

Returns:

setPanLimits

public void setPanLimits(double minX,
                         double maxX,
                         double minY,
                         double maxY)

Sets the pan limits if panning is enabled.

Parameters:

minX - The minimum X-axis value for panning.

maxX - The maximum X-axis value for panning.

minY - The minimum Y-axis value for panning.

maxY - The maximum Y-axis value for panning.

clearPanLimits

public void clearPanLimits()

Removes the pan limits which may have been previously set with setPanLimits(double, double, double, double)

isZoomEnabled

public boolean isZoomEnabled()

Checks whether zoom is enabled.

Returns:

the zoomEnabled

isZoomXEnabled

public boolean isZoomXEnabled()

Checks whether zoom is enabled on the X-axis.

Returns:

isZoomYEnabled

public boolean isZoomYEnabled()

Checks whether zoom is enabled on the Y-axis.

Returns:

setZoomEnabled

public void setZoomEnabled(boolean zoomEnabled)

Enables or disables zoom on both x and y axes.

Parameters:

zoomEnabled - the zoomEnabled to set

setZoomLimits

public void setZoomLimits(double minRangeX,
                          double maxRangeX,
                          double minRangeY,
                          double maxRangeY)

Sets the zoom limits.

NOTE: This method is only applicable when showing an XYChart It will throw a RuntimeException if called while a different kind of chart is being shown.

Parameters:

minRangeX - The minimum distance from XYMultipleSeriesRenderer.getXAxisMin() to XYMultipleSeriesRenderer.getXAxisMax() that can be achieved by zooming in. 0 means no limit.

maxRangeX - The maximum distance from XYMultipleSeriesRenderer.getXAxisMin() to XYMultipleSeriesRenderer.getXAxisMax() that can be achieved by zooming out. 0 means no limit.

minRangeY - The minimum distance from XYMultipleSeriesRenderer.getYAxisMin() to XYMultipleSeriesRenderer.getYAxisMax() that can be achieved by zooming in. 0 means no limit.

maxRangeY - The maximum distance from XYMultipleSeriesRenderer.getYAxisMin() to XYMultipleSeriesRenderer.getYAxisMax() that can be achieved by zooming out. 0 means no limit.

setZoomEnabled

public void setZoomEnabled(boolean zoomX,
                           boolean zoomY)

Enables or disables zoom on x and y axes separately.

Parameters:

zoomX - True to enable zooming x axis.

zoomY - True to enable zooming y axis.

chartBoundsChanged

protected void chartBoundsChanged()

Subclasses can override this method to be informed when the chart bounds change due to panning or zooming.