Archive for the ‘ASP.Net Microsoft Chart’ Category


If you have charts with long names, these might get truncated when the chart is rendered. You can set the property TextWrapThreshold to increase the length of the legend when it is displayed as follows:
ASPX

<asp:Chart id="MyChart" runat="server" EnableViewState="true">
<legends>
  <asp:Legend TextWrapThreshold="600" IsTextAutoFit="false" Name="Default"></asp:Legend></legends>
</asp:Chart>
Advertisements

By default, the property EnableViewState is set to false which means that the chart will not appear after a postback! To have the chart appear across postbacks, just set the EnableViewState to true as follows:
ASPX

<asp:Chart id="MyChart" runat="server" EnableViewState="true">
...
</asp:Chart>

You can bind Tooltips for a PieChart with data from a stored procedure as follows:
ASPX

try
{
  Microsoft.Practices.EnterpriseLibrary.Data.Sql.SqlDatabase DAL = new Microsoft.Practices.EnterpriseLibrary.Data.Sql.SqlDatabase(MyConnectionString);
  System.Data.Common.DbCommand dbgCommand = DAL.GetStoredProcCommand("MyStoredProcedure");
  IDataReader rdr = DAL.ExecuteReader(dbgCommand);

  try
  {
    DataTable dt = new DataTable();
    dt.Load(rdr);

    if (dt.Rows.Count != 0)
    {
      MyChart.DataSource = dt;
      MyChart.DataBind();
      ...
      MyChart.Series["Default"].ToolTip = "#AXISLABEL";
    }
    else
    {
      ...
    }
  }
  finally
  {
    rdr.Close();
    rdr.Dispose();
  }
}
catch (Exception ex)
{
  ...
}

You can bind a PieChart using a stored procedure and IDataReader as follows:
ASPX

<asp:Chart id="MyChart" ImageStorageMode="UseImageLocation" runat="server" Height="350px" Width="675px" ImageLocation="~/TempImages/ChartPic_#SEQ(300,3)" EnableViewState="true">
  <titles><asp:Title Font="Trebuchet MS, 9.25pt, style=Bold" Text="Title" Name="MyChartTitle" </asp:Title></titles>
  <titles><asp:Title Font="Trebuchet MS, 8.25pt, style=Bold" Text="Sub Title" Name="MyChartSubTitle"></asp:Title></titles>
  <legends><asp:Legend Alignment="Center" Docking="Right" Font="Trebuchet MS, 8.25pt, style=Bold" IsTextAutoFit="false" Name="Default" LegendStyle="Column"></asp:Legend></legends>
  <series>
    <asp:Series Name="Default" ChartType="Pie" XValueMember="XVal" YValueMembers="YVal" Font="Trebuchet MS, 7.25pt, style=Bold"></asp:Series>  
  </series>
  <chartareas>
    <asp:ChartArea Name="ChartArea1"></asp:ChartArea>
  </chartareas>
</asp:Chart>  

Code Behind

try
{
  Microsoft.Practices.EnterpriseLibrary.Data.Sql.SqlDatabase DAL = new Microsoft.Practices.EnterpriseLibrary.Data.Sql.SqlDatabase(MyConnectionString);
  System.Data.Common.DbCommand dbgCommand = DAL.GetStoredProcCommand("MyStoredProcedure");
  IDataReader rdr = DAL.ExecuteReader(dbgCommand);

  try
  {
    DataTable dt = new DataTable();
    dt.Load(rdr);

    if (dt.Rows.Count != 0)
    {
      MyChart.DataSource = dt;
      MyChart.DataBind();
      MyChart.Series["Default"].ChartType = SeriesChartType.Pie;
      MyChart.Series[0]["PieDrawingStyle"] = "SoftEdge";
      MyChart.Series["Default"]["PieLabelStyle"] = "Disabled";
      MyChart.Series["Default"].Points[0]["Exploded"] = "true";
      MyChart.ChartAreas["ChartArea1"].Area3DStyle.Enable3D = true;
      MyChart.Legends[0].Enabled = false;
      MyChart.Titles[0].Text = "Title";
      MyChart.Titles[1].Text = "Sub Title";
      MyChart.Series["Default"]["PieLabelStyle"] = "Outside";
    }
    else
    {
      ...
    }
  }
  finally
  {
    rdr.Close();
    rdr.Dispose();
  }
}
catch (Exception ex)
{
  ...
}

By default the Microsoft charting control will not show all the X-Axis labels when a chart is rendered. To show all the labels, you just have to add the following line of code:

Chart1.ChartAreas[0].AxisX.Interval = 1;

While working with Microsoft Charting Control and .Net 3.5, I ran into an issue where I kept getting the error System.EventArgs: Error executing child request for ChartImg.axd… After searching on the web and other forums and trying a few things out, I was able to get it working by doing the following:

web.config
Make sure the following is set in your appSettings tag:

<appSettings>
  <add key="ChartImageHandler" value="Storage=file;Timeout=20;Url=TempImages/;"/>
</appSettings>

Make sure the following is set in your httpHandlers tag:

<httpHandlers>
  <add path="ChartImg.axd" verb="GET,HEAD" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false" />
</httpHandlers>

Make sure the following is set in your handlers tag and remember to put POST in it as well:

<handlers>
  <add name="ChartImageHandler" preCondition="integratedMode" verb="GET,HEAD,POST" path="ChartImg.axd" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
[/handlers]

File Server
Make sure you have a folder called TempImages on the same level as the file that is calling the chart control. For my example, I had the file and folder on the rool level of the application.
ASPX Page
Where you have created the chart control, make sure you have set these properties. For my example I was doing a 3D pie chart:

<asp:Chart id="Chart1" ImageStorageMode="UseImageLocation" runat="server" ImageLocation="TempImages/ChartPic_#SEQ(300,3)" EnableViewState="true">
...
</asp:Chart>

For further information you can read the following post.