AccumulationChartModel API in Vue Accumulation Chart API component

Interface for a class AccumulationChart

Properties

afterExport

EmitType<IAfterExportEventArgs>

Triggers after the export completed.

animationComplete

EmitType<IAccAnimationCompleteEventArgs>

Triggers after animation gets completed for series.

annotationRender

EmitType<IAnnotationRenderEventArgs>

Triggers before the annotation gets rendered.

beforePrint

EmitType<IPrintEventArgs>

Triggers before the prints gets started.

beforeResize

EmitType<IAccBeforeResizeEventArgs>

Triggers before window resize.

chartDoubleClick

EmitType<IMouseEventArgs>

Triggers on double clicking the accumulation chart.

chartMouseClick

EmitType<IMouseEventArgs>

Triggers on clicking the accumulation chart.

chartMouseDown

EmitType<IMouseEventArgs>

Triggers on mouse down.

chartMouseLeave

EmitType<IMouseEventArgs>

Triggers while cursor leaves the accumulation chart.

chartMouseMove

EmitType<IMouseEventArgs>

Triggers on hovering the accumulation chart.

chartMouseUp

EmitType<IMouseEventArgs>

Triggers on mouse up.

legendClick

EmitType<IAccLegendClickEventArgs>

Triggers after legend clicked.

legendRender

EmitType<ILegendRenderEventArgs>

Triggers before the legend gets rendered.

load

EmitType<IAccLoadedEventArgs>

Triggers before accumulation chart load.

loaded

EmitType<IAccLoadedEventArgs>

Triggers after accumulation chart loaded.

pointClick

EmitType<IPointEventArgs>

Triggers on point click.

pointMove

EmitType<IPointEventArgs>

Triggers on point move.

pointRender

EmitType<IAccPointRenderEventArgs>

Triggers before each points for series gets rendered.

resized

EmitType<IAccResizeEventArgs>

Triggers after window resize.

selectionComplete

EmitType<IAccSelectionCompleteEventArgs>

Triggers after the selection is completed.

seriesRender

EmitType<IAccSeriesRenderEventArgs>

Triggers before the series gets rendered.

textRender

EmitType<IAccTextRenderEventArgs>

Triggers before the data label for series gets rendered.

tooltipRender

EmitType<ITooltipRenderEventArgs>

Triggers before the tooltip for series gets rendered.

allowExport

boolean

To enable export feature in blazor chart.

annotations

AccumulationAnnotationSettingsModel[]

The configuration for annotation in chart.

background

string

The background color of the chart, which accepts value in hex, rgba as a valid CSS color string.

backgroundImage

string

The background image of the chart that accepts value in string as url link or location of an image.

border

BorderModel

Options for customizing the color and width of the chart border.

center

PieCenterModel

Center of pie

dataSource

Object | DataManager

Specifies the dataSource for the AccumulationChart. It can be an array of JSON objects or an instance of DataManager.

<div id='Pie'></div>

let dataManager: DataManager = new DataManager({
        url: 'http://mvc.syncfusion.com/Services/Northwnd.svc/Tasks/'
});
let query: Query = new Query().take(50).where('Estimate', 'greaterThan', 0, false);
let pie: AccumulationChart = new AccumulationChart({
...
    dataSource: dataManager,
    series: [{
       xName: 'Id',
       yName: 'Estimate',
       query: query
   }],
...
});
pie.appendTo('#Pie');

enableAnimation

boolean

If set true, enables the animation for both chart and accumulation.

enableBorderOnMouseMove

boolean

If set true, enables the border in pie and accumulation chart while mouse moving.

enableExport

boolean

To enable export feature in chart.

enablePersistence

boolean

Enable or disable persisting component’s state between page reloads.

enableRtl

boolean

Enable or disable rendering component in right to left direction.

enableSmartLabels

boolean

If set true, labels for the point will be placed smartly without overlapping.

height

string

The height of the chart as a string in order to provide input as both like ‘100px’ or ‘100%‘. If specified as ‘100%, chart will render to the full height of its parent element.

highlightColor

string

Defines the highlight color for the data point when user hover the data point.

highlightMode

AccumulationHighlightMode

Specifies whether point has to get highlighted or not. Takes value either ‘None ‘or ‘Point’ None: Disables the highlight. Point: highlight a point.

highlightPattern

SelectionPattern

Specifies whether series or data point has to be selected. They are,

• none: sets none as highlighting pattern to accumulation chart.
• chessboard: sets chess board as highlighting pattern to accumulation chart.
• dots: sets dots as highlighting pattern to accumulation chart.
• diagonalForward: sets diagonal forward as highlighting pattern to accumulation chart.
• crosshatch: sets crosshatch as highlighting pattern to accumulation chart.
• pacman: sets pacman highlighting pattern to accumulation chart.
• diagonalbackward: sets diagonal backward as highlighting pattern to accumulation chart.
• grid: sets grid as highlighting pattern to accumulation chart.
• turquoise: sets turquoise as highlighting pattern to accumulation chart.
• star: sets star as highlighting pattern to accumulation chart.
• triangle: sets triangle as highlighting pattern to accumulation chart.
• circle: sets circle as highlighting pattern to accumulation chart.
• tile: sets tile as highlighting pattern to accumulation chart.
• horizontaldash: sets horizontal dash as highlighting pattern to accumulation chart.
• verticaldash: sets vertical dash as highlighting pattern to accumulation chart.
• rectangle: sets rectangle as highlighting pattern to accumulation chart.
• box: sets box as highlighting pattern to accumulation chart.
• verticalstripe: sets vertical stripe as highlighting pattern to accumulation chart.
• horizontalstripe: sets horizontal stripe as highlighting pattern to accumulation chart.
• bubble: sets bubble as highlighting pattern to accumulation chart.

isMultiSelect

boolean

If set true, enables the multi selection in accumulation chart. It requires selectionMode to be Point.

legendSettings

LegendSettingsModel

Options for customizing the legend of accumulation chart.

locale

string

Overrides the global culture and localization value for this component. Default global culture is ‘en-US’.

margin

MarginModel

Options to customize the left, right, top and bottom margins of accumulation chart.

selectedDataIndexes

IndexesModel[]

Specifies the point indexes to be selected while loading a accumulation chart. It requires selectionMode to be Point.

<div id='Pie'></div>

let pie: AccumulationChart = new AccumulationChart({
...
  selectionMode: 'Point',
  selectedDataIndexes: [ { series: 0, point: 1},
                         { series: 2, point: 3} ],
...
});
pie.appendTo('#Pie');

selectionMode

AccumulationSelectionMode

Specifies whether point has to get selected or not. Takes value either ‘None ‘or ‘Point’ None: Disables the selection. Point: selects a point.

selectionPattern

SelectionPattern

Specifies whether series or data point for accumulation chart has to be selected. They are,

• none: sets none as selecting pattern to accumulation chart .
• chessboard: sets chess board as selecting pattern accumulation chart .
• dots: sets dots as selecting pattern accumulation chart .
• diagonalForward: sets diagonal forward as selecting pattern to accumulation chart .
• crosshatch: sets crosshatch as selecting pattern to accumulation chart.
• pacman: sets pacman selecting pattern to accumulation chart.
• diagonalbackward: sets diagonal backward as selecting pattern to accumulation chart.
• grid: sets grid as selecting pattern to accumulation chart.
• turquoise: sets turquoise as selecting pattern to accumulation chart.
• star: sets star as selecting pattern to accumulation chart.
• triangle: sets triangle as selecting pattern to accumulation chart.
• circle: sets circle as selecting pattern to accumulation chart.
• tile: sets tile as selecting pattern to accumulation chart.
• horizontaldash: sets horizontal dash as selecting pattern to accumulation chart.
• verticaldash: sets vertical dash as selecting pattern to accumulation chart.
• rectangle: sets rectangle as selecting pattern.
• box: sets box as selecting pattern to accumulation chart.
• verticalstripe: sets vertical stripe as selecting pattern to accumulation chart.
• horizontalstripe: sets horizontal stripe as selecting pattern to accumulation chart.
• bubble: sets bubble as selecting pattern to accumulation chart.

series

AccumulationSeriesModel[]

The configuration for series in accumulation chart.

subTitle

string

SubTitle for accumulation chart

subTitleStyle

FontModel

Options for customizing the subtitle of accumulation chart.

theme

AccumulationTheme

Specifies the theme for accumulation chart.

title

string

Title for accumulation chart

titleStyle

FontModel

Options for customizing the title of accumulation chart.

tooltip

TooltipSettingsModel

Options for customizing the tooltip of accumulation chart.

useGroupingSeparator

boolean

Specifies whether a grouping separator should be used for a number.

width

string

The width of the chart as a string in order to provide input as both like ‘100px’ or ‘100%‘. If specified as ‘100%, chart will render to the full width of its parent element.