Product Bundles
DevCraft
All Telerik .NET tools and Kendo UI JavaScript components in one package. Now enhanced with:
Web
Mobile
Document Management
Desktop
Reporting
Testing & Mocking
CMS
UI/UX Tools
Debugging
Free Tools
Support and Learning
Productivity and Design Tools
How can I get the index of the series item on a Line Chart when clicking on it?
I am using OnSeriesClick
function OnSeriesClick(args) { alert(args.value); }
I don't care about the value of the item, what I need is the index of it in the series.
Thanks,
Hello Josh,
You can use the category of the clicked item to get the index you want:
<telerik:RadHtmlChart runat="server" ID="ColumnChart" Width="800" Height="500" Transitions="true" Skin="Silk"> <PlotArea> <Series> <telerik:ColumnSeries Name="Wooden Table" Stacked="false" Gap="1.5" Spacing="0.4"> <LabelsAppearance DataFormatString="{0} sales" Position="OutsideEnd"></LabelsAppearance> <TooltipsAppearance DataFormatString="{0} sales" Color="White"></TooltipsAppearance> <SeriesItems> <telerik:CategorySeriesItem Y="25000"></telerik:CategorySeriesItem> <telerik:CategorySeriesItem Y="12000"></telerik:CategorySeriesItem> <telerik:CategorySeriesItem Y="39000"></telerik:CategorySeriesItem> </SeriesItems> </telerik:ColumnSeries> </Series> <XAxis AxisCrossingValue="0" Color="black"> <Items> <telerik:AxisItem LabelText="1"></telerik:AxisItem> <telerik:AxisItem LabelText="2"></telerik:AxisItem> <telerik:AxisItem LabelText="3"></telerik:AxisItem> </Items> <LabelsAppearance DataFormatString="Q{0}" RotationAngle="0" Skip="0" Step="1" /> <TitleAppearance Position="Center" RotationAngle="0" Text="Quarters" /> </XAxis> <YAxis AxisCrossingValue="0" Color="black" MajorTickSize="1" MajorTickType="Outside" MinorTickType="None" Reversed="false"> <LabelsAppearance DataFormatString="{0} sales" RotationAngle="0" Skip="0" Step="1" /> <TitleAppearance Position="Center" RotationAngle="0" Text="Sales" /> </YAxis> </PlotArea> <ClientEvents OnSeriesClick="onSeriesClick" /> </telerik:RadHtmlChart>
function onSeriesClick(e) { let itemIndex = e.category; console.log(`Clicked Item ${itemIndex}`); }
Try this and see if it will be of use to your scenario.
Regards, Vasko Progress Telerik