Chart

Example

<kendo-chart>
    <axis-defaults></axis-defaults>
    <category-axis></category-axis>
    <chart-area></chart-area>
    <chart-legend></chart-legend>
    <chart-subtitle></chart-subtitle>
    <chart-title></chart-title>
    <datasource></datasource>
    <pane-defaults></pane-defaults>
    <panes></panes>
    <pannable />
    <pdf></pdf>
    <plot-area></plot-area>
    <series></series>
    <series-defaults></series-defaults>
    <tooltip></tooltip>
    <value-axis></value-axis>
    <x-axis></x-axis>
    <y-axis></y-axis>
    <zoomable></zoomable>
</kendo-chart>

ChildTags

Tag Name Details
axis-defaults ChartAxisDefaultsSettingsTagHelper
category-axis ChartCategoryAxisTagHelperCollection
chart-area ChartChartAreaSettingsTagHelper
chart-legend ChartLegendSettingsTagHelper
chart-subtitle ChartSubtitleSettingsTagHelper
chart-title ChartTitleSettingsTagHelper
datasource DataSourceTagHelper
pane-defaults ChartPaneDefaultsSettingsTagHelper
panes ChartPanesTagHelper
pannable ChartPannableSettingsTagHelper
pdf ChartPdfSettingsTagHelper
plot-area ChartPlotAreaSettingsTagHelper
series ChartSeriesTagHelperCollection
series-defaults ChartSeriesDefaultsSettingsTagHelper
tooltip ChartTooltipSettingsTagHelper
value-axis ChartValueAxisTagHelperCollection
x-axis ChartXAxisTagHelperCollection
y-axis ChartYAxisTagHelperCollection
zoomable ChartZoomableSettingsTagHelper

Attributes

Attribute Type Description
name String Sets the name of the component.
as-child-component Boolean
datasource-id String The Id of the data source.
deferred Boolean Suppress initialization script rendering. Note that this options should be used in conjunction with DeferredScripts method.
is-in-client-template Boolean When placing a Tag Helper within a Kendo Template, set the type to text/html and add the is-in-client-template="true" attribute.
auto-bind Boolean If set to false the widget will not bind to the data source during initialization. In this case data binding will occur when the change event of the data source is fired. By default the widget will bind to the data source specified in the configuration.
has-client-component Boolean
on-axis-label-click String Fired when the user clicks an axis label.The event handler function context (available via the this keyword) will be set to the widget instance.
on-data-bound String Fired when the widget is bound to data from its data source.The event handler function context (available via the this keyword) will be set to the widget instance.
on-drag String Fired as long as the user is dragging the chart using the mouse or swipe gestures.The event handler function context (available via the this keyword) will be set to the widget instance.
on-drag-end String Fired when the user stops dragging the chart.The event handler function context (available via the this keyword) will be set to the widget instance.
on-drag-start String Fired when the user starts dragging the chart.The event handler function context (available via the this keyword) will be set to the widget instance.
on-drilldown String Fires when the user when the user wants to drill down on a specific point.The event handler function context (available via the this keyword) will be set to the widget instance.
on-drilldown-level-change String Fires when the drill-down level has changed.The event handler function context (available via the this keyword) will be set to the widget instance.
on-legend-item-click String Fires when an legend item is clicked, before the selected series visibility is toggled. Can be cancelled.
on-legend-item-hover String Fires when an legend item is hovered.
on-legend-item-leave String Fires when the cursor leaves a legend item.
on-note-click String Fired when the user clicks one of the notes.The event handler function context (available via the this keyword) will be set to the widget instance.
on-note-hover String Fired when the user hovers one of the notes.The event handler function context (available via the this keyword) will be set to the widget instance.
on-note-leave String Fired when the cursor leaves a note.The event handler function context (available via the this keyword) will be set to the widget instance.
on-pane-render String Fires when a pane is rendered because the chart is rendered, or the chart performs panning or zooming, or because the chart is exported with different options. The event can be used to render custom visuals in the panes.
on-plot-area-click String Fired when the user clicks the plot area.
on-plot-area-hover String Fired when the user hovers the plot area.
on-plot-area-leave String Fired when the cursor leaves the plotArea.
on-render String Fired when the chart is ready to render on screen.Can be used, for example, to remove loading indicators.The event handler function context (available via the this keyword) will be set to the widget instance.
on-select String Fired when the user modifies the selection.The range units are: Generic axis - Category index (0-based) or Date axis - Date instance. The event handler function context (available via the this keyword) will be set to the widget instance.
on-select-end String Fired when the user completes modifying the selection.The range units are: Generic axis - Category index (0-based) or Date axis - Date instance. The event handler function context (available via the this keyword) will be set to the widget instance.
on-select-start String Fired when the user starts modifying the axis selection.The range units are: Generic axis - Category index (0-based) or Date axis - Date instance. The event handler function context (available via the this keyword) will be set to the widget instance.
on-series-click String Fired when the user clicks the chart series.
on-series-hover String Fired when the user hovers the chart series.The event handler function context (available via the this keyword) will be set to the widget instance.
on-series-leave String Fired when the cursor leaves a chart series.
on-series-over String Fired when the cursor is over the chart series.
on-zoom String Fired as long as the user is zooming the chart using the mousewheel.The event handler function context (available via the this keyword) will be set to the widget instance.
on-zoom-end String Fired when the user stops zooming the chart.The event handler function context (available via the this keyword) will be set to the widget instance.
on-zoom-start String Fired when the user uses the mousewheel to zoom the chart.The event handler function context (available via the this keyword) will be set to the widget instance.
persist-series-visibility Boolean Specifies if the series visible option should be persisted when changing the dataSource data.
render-as RenderingMode Specifies the preferred widget rendering mode.
sanitize-id Boolean
series-colors String[] The default colors for the chart's series. When all colors are used, new colors are pulled from the start again.
theme String The chart theme. With versions prior to R1 2023 this can be either the respective LESS theme from the list below or "sass". When set to "sass" the chart will read the variables from the Sass-based themes.Note: Since Q2 2024 release, the default value for the theme property is "sass" instead of "default". It is recommended to use "sass" with version Q2 2024 or later.The supported values are: "sass"; "black"; "blueopal"; "bootstrap"; "default"; "fiori"; "flat"; "highcontrast"; "material"; "materialblack"; "metro"; "metroblack"; "moonlight"; "nova"; "office365"; "silver" or "uniform".
transitions Boolean If set to true the chart will play animations when displaying the series. By default animations are enabled.
In this article
Not finding the help you need?