Text on a Pie Chart RRS feed

  • Question

  • User1321801904 posted

    Hello good people,

    I am trying to draw a simple pie chart using the drawing classes (C# asp.net 2.0 Drawing classes..no charting tools)

    I am able to find code/material for that however my requirement is...

    to display text on the image (pie chart) itself..not as caption/legend by the side.

    the slices of the pie should display text information and color as well. 

    Is this possible at all ? any links/code samples would be greatly appreciated

    thanks in advance.

    Monday, May 25, 2009 5:43 AM


All replies

  • User-1310709513 posted

     You can try ZedGraph, its flexible and robust.

    Monday, May 25, 2009 6:36 AM
  • User1321801904 posted

    but shashankmishra, i do not want to use any third party tools (there are plenty of options in that).

    i just want to use system.drawing classes and display text in the pie chart, is that possible ?

    Monday, May 25, 2009 8:46 AM
  • User-1310709513 posted

    Look here:

    Also the library that I told you is opensource.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, May 26, 2009 1:04 AM
  • User1321801904 posted

    shashank thanks for the reply,

    ZedGraph looks good, have you used it to develop charts in asp.net 2.0 ?

    i am trying to use the class library and most of the classes used there have Windows.Forms namespace imported.

    doesnt that make them unfit for using in a web application ? i have been trying to figure out how to use them in aspx pages

    searching the web gives many windows forms examples...not much in web apps.

    any pointers will be helpful.

    thank you

    Thursday, May 28, 2009 8:59 AM
  • User-1310709513 posted
    Create a folder named ZedGraphImages at the root of web directory.

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

    <%@ Register Assembly="ZedGraph.Web" Namespace="ZedGraph.Web" TagPrefix="zgw" %>
    <!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">
        <form id="form1" runat="server">
            <zgw:ZEDGRAPHWEB id="ZedGraphWeb1" runat="server" RenderMode="ImageTag" IsImageMap="true"
                Width="500" Height="350">

    -------------------------------------------------------- CS ----------------------------------------------------------------------

    protected void Page_Load(object sender, EventArgs e)
                ZedGraphWeb1.RenderGraph += new ZedGraph.Web.ZedGraphWebControlEventHandler(ZedGraphWeb1_RenderGraph);

            void ZedGraphWeb1_RenderGraph(ZedGraph.Web.ZedGraphWeb webObject, System.Drawing.Graphics g, ZedGraph.MasterPane masterPane)
                // Get the GraphPane so we can work with it
                GraphPane myPane = masterPane[0];

                // Set the title and axis labels
                myPane.Title.Text = "Demo Page";
                myPane.YAxis.Title.Text = "Status";
                myPane.XAxis.Title.Text = "Revenue";

                // Make up some data points
                string[] labels = { "Panther", "Lion", "Cheetah", "Cougar", "Tiger", "Leopard" };
                double[] y1 = { 100, 115, 75, 22, 98, 40 };
                double[] y2 = { 120, 175, 95, 57, 113, 110 };
                double[] y3 = { 204, 192, 119, 80, 134, 156 };

                // Generate a red bar with "Curve 1" in the legend
                //BarItem myCurve = myPane.AddBar("North", null, y1, Color.Red);
                //// Fill the bar with a red-white-red color gradient for a 3d look
                //myCurve.Bar.Fill = new Fill(Color.Red, Color.White, Color.Red, 0f);
                //// Create a link for this curve.  Note that the link.Title is not actually used, since
                //// each PointPair will have a Tag string defined (see below)
                //myCurve.Link = new Link("North", "http://zedgraph.org/samples/imagemapsample.php?region=North", "_blank");

                //// Generate a blue bar with "Curve 2" in the legend
                //myCurve = myPane.AddBar("Central", null, y2, Color.Blue);
                //// Fill the bar with a Blue-white-Blue color gradient for a 3d look
                //myCurve.Bar.Fill = new Fill(Color.Blue, Color.White, Color.Blue, 0f);
                //// Create a link for this curve.  Note that the link.Title is not actually used, since
                //// each PointPair will have a Tag string defined (see below)
                //myCurve.Link = new Link("Central", "http://zedgraph.org/samples/imagemapsample.php?region=Central", "_blank");

                //// Generate a green bar with "Curve 3" in the legend
                //myCurve = myPane.AddBar("South", null, y3, Color.Green);
                //// Fill the bar with a Green-white-Green color gradient for a 3d look
                //myCurve.Bar.Fill = new Fill(Color.Green, Color.White, Color.Green, 0f);
                //// Create a link for this curve.  Note that the link.Title is not actually used, since
                //// each PointPair will have a Tag string defined (see below)
                //myCurve.Link = new Link("South", "http://zedgraph.org/samples/imagemapsample.php?region=South", "_blank");

                PieItem segment1 = myPane.AddPieSlice(100, Color.Red, Color.White, 25f, 0, "North");
                segment1.Link = new Link("Google", "http://www.google.com", "_blank");
                PieItem segment2 = myPane.AddPieSlice(100, Color.Green, Color.White, 25f, 0, "South");
                segment2.Link = new Link("Google", "http://www.google.com", "_blank");
                PieItem segment3 = myPane.AddPieSlice(100, Color.Blue, Color.White, 25f, 0, "West");
                segment3.Link = new Link("Google", "http://www.google.com", "_blank");
                // Define a string for each PointPair that will be the tooltip string and store it in the
                // Tag property
                foreach (CurveItem curve in myPane.CurveList)
                    int i = 0;
                    string name = curve.Label.Text;
                    foreach (PointPair pt in curve.Points as PointPairList)
                        pt.Tag = "There are " + pt.Y.ToString() + " " + labels[i] + "s in the " + name + " region";

                // Draw the X tics between the labels instead of at the labels
                myPane.XAxis.MajorTic.IsBetweenLabels = true;

                // Set the XAxis labels
                myPane.XAxis.Scale.TextLabels = labels;
                // Set the XAxis to Text type
                myPane.XAxis.Type = AxisType.Text;

                // Set the bar type to stack, which stacks the bars by automatically accumulating the values
                myPane.BarSettings.Type = BarType.Stack;

                // Make the bars horizontal by setting the BarBase to "X"
                myPane.BarSettings.Base = BarBase.X;

                // Fill the axis background with a color gradient
                myPane.Chart.Fill = new Fill(Color.White,
                    Color.FromArgb(255, 255, 166), 45.0F);

                // Create an invisible BoxObj that makes the entire chart area a hyperlink.  In this case,
                // the BoxObj is placed behind the curves (ZOrder.D_BehindCurves) so that the individual
                // CurveItem links have the highest priority.
                BoxObj box = new BoxObj(0, 0, 1, 1, Color.Empty, Color.Empty);
                box.Location.CoordinateFrame = CoordType.ChartFraction;
                box.ZOrder = ZOrder.E_BehindCurves;
                box.Link = new Link("Chart Region", "http://zedgraph.org/samples/imagemapsample.php", "_blank");



    -------------------------------------------------------- CS ----------------------------------------------------------------------
    Use ZedGraph Wiki to learn it.
    <title></title> <form id="form1" runat="server">
    <zgw:zedgraphweb id="ZedGraphWeb1" runat="server" rendermode="ImageTag" isimagemap="true" width="500" height="350"> </zgw:zedgraphweb>
    Friday, May 29, 2009 2:59 AM
  • User-1310709513 posted

     Use the below given link:


    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, May 29, 2009 3:06 AM
  • User1321801904 posted

    thanks for all the help shashank, really appreciate it.

    Wednesday, June 3, 2009 12:25 AM