Sparkline

Example

Razor

<kendo-sparkline>
    <axis-defaults></axis-defaults>
    <category-axis></category-axis>
    <chart-area></chart-area>
    <chart-legend></chart-legend>
    <chart-title></chart-title>
    <datasource></datasource>
    <panes></panes>
    <pdf></pdf>
    <plot-area></plot-area>
    <series />
    <series-defaults></series-defaults>
    <tooltip></tooltip>
    <value-axis></value-axis>
    <x-axis />
</kendo-sparkline>

ChildTags

Tag Name	Details
axis-defaults	ChartTagHelper
category-axis	ChartTagHelper
chart-area	ChartTagHelper
chart-legend	ChartTagHelper
chart-title	ChartTagHelper
datasource	ChartTagHelper
panes	ChartTagHelper
pdf	ChartTagHelper
plot-area	ChartTagHelper
series	ChartTagHelper
series-defaults	ChartTagHelper
tooltip	ChartTagHelper
value-axis	ChartTagHelper
x-axis	ChartTagHelper

Attributes

Attribute	Type	Description
name	String	Sets the name of the component.
has-client-component	Boolean
deferred	Boolean	Suppress initialization script rendering. Note that this options should be used in conjunction with DeferredScripts method.
on-axis-label-click	String	Fires when an axis label is clicked.
on-data-bound	String	Fires when the sparkline has received data from the data source and is about to render it.
on-drag	String	Fires when the user has used the mouse or a swipe gesture to drag the sparkline.The drag operation can be aborted by calling e.preventDefault().
on-drag-end	String	Fires when the user stops dragging the sparkline.
on-drag-start	String	Fires when the user has used the mouse or a swipe gesture to drag the sparkline.The drag operation can be aborted by calling e.preventDefault().
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.
as-module	Boolean
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.
datasource-id	String	The Id of the data source.
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	Fires when plot area is clicked.
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	Fires when chart series are clicked.
on-series-hover	String	Fires when chart series are hovered. The data that is available when the event is fired is listed below.
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	Fires when the user has used the mousewheel to zoom the chart.The zoom operation can be aborted by calling e.preventDefault().
on-zoom-end	String	Fires when the user stops zooming the chart.
on-zoom-start	String	Fires when the user has used the mousewheel to zoom the chart.The zoom operation can be aborted by calling e.preventDefault().
persist-series-visibility	Boolean	Specifies if the series visible option should be persisted when changing the dataSource data.
point-width	Double	The width to allocate for each data point.
render-as	RenderingMode	Specifies the preferred widget rendering mode.
sanitize-id	Boolean
script-attributes	IDictionary<String,Object>
series-colors	String[]	The default colors for the chart's series. When all colors are used, new colors are pulled from the start again.
series-data	IEnumerable	Gets or sets the default series data
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.
type	SparklineType	Gets or sets the default series type. The default value is SparklineType.Line.