This is a migrated thread and some comments may be shown as answers.

HtmlRadChart bar action url

2 Answers 87 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

2 Answers, 1 is accepted

answered on 11 Feb 2014, 04:34 PM

Hi Humberto,

You can handle OnClientClicked/OnClientHovered client-side event of the chart where can be obtained additional columns from the data source that contains the links which are to be redirected. For example:
JavaScript:

<script type="text/javascript">

function OnClientSeriesClicked(sender, args) {

var currLink = args.get_dataItem().myLinks;

window.open(currLink, "_blank");

}

</script>

ASPX:

<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="400" OnClientSeriesClicked="OnClientSeriesClicked">

<PlotArea>

<Series>

<telerik:ColumnSeries DataFieldY="myYValues" Name="Series 1">

<LabelsAppearance>

<ClientTemplate>

Redirect to #=dataItem.myLinks#

</ClientTemplate>

</LabelsAppearance>

<TooltipsAppearance>

<ClientTemplate>

Redirect to #=dataItem.myLinks#

</ClientTemplate>

</TooltipsAppearance>

</telerik:ColumnSeries>

</Series>

<XAxis DataLabelsField="myXValues">

</XAxis>

</PlotArea>

<ChartTitle Text="Chart Title">

</ChartTitle>

</telerik:RadHtmlChart>

C#:

protected void Page_Load(object sender, EventArgs e)

{

RadHtmlChart1.DataSource = GetData();

RadHtmlChart1.DataBind();

}

protected DataTable GetData()

{

DataTable dt = new DataTable();

dt.Columns.Add("ID");

dt.Columns.Add("myYValues");

dt.Columns.Add("myLinks");

dt.Rows.Add(1, 30, "http://www.telerik.com");

dt.Rows.Add(2, 10, "http://www.bing.com");

dt.Rows.Add(3, 20, "http://www.google.com");

return dt;

}

You may also find useful ClientTemplate for Series Labels and Tooltips help article.

Regards,
Danail Vasilev
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

HtmlRadChart bar action url

2 Answers, 1 is accepted