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

Click on a bar event

2 Answers 156 Views

Chart (Obsolete)

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

2 Answers, 1 is accepted

answered on 19 Jan 2012, 09:50 PM

this is what i have so far :

List<ConnexionFrequencyByCompany> ConnexionFrequencybyCompanyList = new List<ConnexionFrequencyByCompany>();

ConnexionFrequencybyCompanyList = DAaccess.LibDataUsers.LibDataUsers.GetHistoUsersByCompanyByFrequency((DateTime)RadDateTimePicker1.SelectedDate, (DateTime)RadDateTimePicker2.SelectedDate);

foreach (var item in ConnexionFrequencybyCompanyList)

{

ChartSeries series1 = new ChartSeries(item.NameCompany, ChartSeriesType.Bar);

RadChart1.Series.Add(series1);

series1.AddItem(Convert.ToDouble(item.NumberOfConnections));

RadChart1.Visible = true;

}

I need to be able to click on the bars to open a popup or radwindow/
i already checked out this link : http://www.telerik.com/help/aspnet/chart/advancedopenpopup.html

Not working for me unfortunately
thanks in advance

answered on 23 Jan 2012, 04:06 PM

RadChart-SeriesClick-PopsUpWindow.png

Adigard:

This works for me to open a popup window when clicking on the second bar in the series (value=11).

Default.aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Charting" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" />

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

<Scripts>

<%--Needed for JavaScript IntelliSense in VS2010--%>

<%--For VS2008 replace RadScriptManager with ScriptManager--%>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />

</Scripts>

</telerik:RadScriptManager>

<script type="text/javascript">

function ShowPopUpDialog(url) {

window.open(url, 'MyPopUpWindow', 'height = 500px, width = 500px', true);

}

</script>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

</telerik:RadAjaxManager>

<div>

<telerik:RadChart ID="RadChart1" runat='server'>

</telerik:RadChart>

</div>

</form>

</body>

</html>

Default.aspx.cs:

using System;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data;

using System.Configuration;

using System.Web.Security;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using Telerik.Web.UI;

using Telerik.Charting;

public partial class Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

if (!Page.IsPostBack)

{

LoadChart();

}

private void LoadChart()

{

RadChart1.Series.Clear();

ChartSeries c = new ChartSeries("Series1", ChartSeriesType.Bar);

c.AddItem(5);

c.AddItem(11);

c.AddItem(25);

c.AddItem(23);

RadChart1.AddChartSeries(c);

//Define which chart series item will be clickable

int i = 1;

RadChart1.Series[0].Items[i].ActiveRegion.Url = "javascript:ShowPopUpDialog('http://www.telerik.com');";

}

See attached "radchart_seriesclick_popsupwindow.png" image for display on clicking chart series item #2.

Hope this helps!