Declined
Last Updated: 26 Jul 2016 11:00 by ADMIN
Matthew
Created on: 19 Feb 2014 19:11
Category: HtmlChart
Type: Feature Request
0
Highlight line on charts on mouse hover
increase line width when mouse hovers
2 comments
ADMIN
Danail Vasilev
Posted on: 26 Jul 2016 11:00
You can try to attach to the seriesHover event where you can increase the width of the hovered series and after some timeout retrieve the original width:
		<script>
			var chart, width, animation;
			function chartLoad(sender, args) {
				chart = sender.get_kendoWidget();
				width = chart.options.series[0].width;
				animation = chart.options.transitions;
			}
			function seriesHover(e) {
				e.sender.options.series[e.series.index].width = 10;
				e.sender.setOptions({ series: e.sender.options.series, transitions: false });
				setTimeout(function () {
					e.sender.options.series[e.series.index].width = width;
					e.sender.setOptions({ series: e.sender.options.series, transitions: false });
					e.sender.options.transitions = animation;
				}, 2000);
			}
		</script>
		<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="400">
			<ClientEvents OnSeriesHover="seriesHover" OnLoad="chartLoad" />
			<PlotArea>
				<Series>
					<telerik:LineSeries Name="Series 1">
						<Appearance></Appearance>
						<SeriesItems>
							<telerik:CategorySeriesItem Y="30" />
							<telerik:CategorySeriesItem Y="10" />
							<telerik:CategorySeriesItem Y="30" />
							<telerik:CategorySeriesItem Y="20" />
						</SeriesItems>
					</telerik:LineSeries>
				</Series>
				<XAxis>
					<LabelsAppearance RotationAngle="33"></LabelsAppearance>
					<Items>
						<telerik:AxisItem LabelText="Item 1" />
						<telerik:AxisItem LabelText="Item 2" />
						<telerik:AxisItem LabelText="Item 3" />
						<telerik:AxisItem LabelText="Item 4" />
					</Items>
				</XAxis>
			</PlotArea>
		</telerik:RadHtmlChart>
ADMIN
Rumen
Posted on: 22 Jul 2016 13:56
Declined due to lack of demand by the community.