locked
Charts - How to show values at the tip of each column RRS feed

  • Question

  • User325035487 posted

    I am using this code.

    @using System.Web.UI.DataVisualization.Charting*@
    @{
        var db = Database.Open("ereq");
        string welcomeuser = (string)Session["userid"];
        var domainname = (string)Session["domain"];
        int hospital_temp = (int)Session["hospitalid"];
    
        var questionid = UrlData[0].IsEmpty() ? 0 : UrlData[0].AsInt();
        
        var sql_ans = "select Definition,cnt from sresponsequery where questionid=@0";
        var ans_data = db.Query(sql_ans, questionid);
    
        var sql_q = "SELECT TOP 1 SQuestion FROM SResponseQuery WHERE questionid=@0";
        var qdata = (string)db.QueryValue(sql_q, questionid);
        }
    
    
    <div class="charts">
    
        @{
            var myChart = new Chart(width: 600, height: 400, theme: ChartTheme.Green)
    
            .AddTitle(qdata)
            .AddLegend()
            .AddSeries("Number", chartType: "pie",axisLabel: "1,2,3",xValue: ans_data, xField: "Definition",yValues: ans_data, yFields: "cnt");
           // myChart.IsValueShownAsLabel = true;
            myChart.Write();
    
        }

    I cannot get to display the column labels despite putting strings in axisLabel: "1,2,3" etc. But when I check nothing appears in the graph.

    I searched extensively and found a solution for MVC which uses System.Web.UI.DataVisualization.Charting Namespace. But this is causing a conflict with System.Web.Helper chart class. So i commented out the use of that in the code posted above.

    This is the link to MVC solution: http://stackoverflow.com/questions/25843722/asp-net-mvc-chart-how-to-show-values-on-each-column

    Any help is highly appreciated.

    Wednesday, February 18, 2015 3:05 AM

Answers

  • User-821857111 posted

    The Web Pages Chart helper is just a façade around System.Web.UI.DataVisualization.Charting. If you want to do something that the Chart helper doesn't support, you can ditch the helper and fall back on the Charting API instead. You can take the code in the solution you linked to and place it in a separate cshtml file. Then you can set the src attribute of an image to the file name. 

    Here's an example of a chart generating file using the code you found. I named it Chart.cshtml:

    @using System.Drawing
    @using WebChart = System.Web.UI.DataVisualization.Charting
    @{
        using (Bitmap image = new Bitmap(500, 50))
        {
            using (Graphics g = Graphics.FromImage(image))
            {
                 var chart1 = new WebChart.Chart();
                 chart1.Width = 1000;
                 chart1.Height = 300;
                 chart1.ChartAreas.Add("xAxis").BackColor = Color.FromArgb(64,Color.White);
                 chart1.Series.Add("xAxis");
                 chart1.Series["xAxis"].Points.AddY(8);
                 chart1.Series["xAxis"].Points.AddY(8);
                 chart1.Series["xAxis"].Points.AddY(8);
                 chart1.Series["xAxis"].Points.AddY(6);
                 chart1.Series["xAxis"].Points.AddY(5);    
                 chart1.Series["xAxis"].IsValueShownAsLabel = true;
                 chart1.BackColor = Color.Transparent;
                 MemoryStream imageStream = new MemoryStream();
                 chart1.SaveImage(imageStream, WebChart.ChartImageFormat.Png);
                 chart1.TextAntiAliasingQuality = WebChart.TextAntiAliasingQuality.SystemDefault;
                 Response.ContentType = "image/png";
                 imageStream.WriteTo(Response.OutputStream);
             }
        }
    }
    

    And here's how you display it:

    <img src="/chart" alt="chart" />

    One thing you will need to do is to add a reference to System.Web.UI.Datavisualization.Charting to your site. If you are using WebMatrix, you can use the Add Existing Item option to copy it to your bin folder. Look for  System.Web.DataVisualization.dll in C:\Windows\Microsoft.NET\Framework\v4.0.30319.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, February 18, 2015 4:03 AM

All replies

  • User-821857111 posted

    The Web Pages Chart helper is just a façade around System.Web.UI.DataVisualization.Charting. If you want to do something that the Chart helper doesn't support, you can ditch the helper and fall back on the Charting API instead. You can take the code in the solution you linked to and place it in a separate cshtml file. Then you can set the src attribute of an image to the file name. 

    Here's an example of a chart generating file using the code you found. I named it Chart.cshtml:

    @using System.Drawing
    @using WebChart = System.Web.UI.DataVisualization.Charting
    @{
        using (Bitmap image = new Bitmap(500, 50))
        {
            using (Graphics g = Graphics.FromImage(image))
            {
                 var chart1 = new WebChart.Chart();
                 chart1.Width = 1000;
                 chart1.Height = 300;
                 chart1.ChartAreas.Add("xAxis").BackColor = Color.FromArgb(64,Color.White);
                 chart1.Series.Add("xAxis");
                 chart1.Series["xAxis"].Points.AddY(8);
                 chart1.Series["xAxis"].Points.AddY(8);
                 chart1.Series["xAxis"].Points.AddY(8);
                 chart1.Series["xAxis"].Points.AddY(6);
                 chart1.Series["xAxis"].Points.AddY(5);    
                 chart1.Series["xAxis"].IsValueShownAsLabel = true;
                 chart1.BackColor = Color.Transparent;
                 MemoryStream imageStream = new MemoryStream();
                 chart1.SaveImage(imageStream, WebChart.ChartImageFormat.Png);
                 chart1.TextAntiAliasingQuality = WebChart.TextAntiAliasingQuality.SystemDefault;
                 Response.ContentType = "image/png";
                 imageStream.WriteTo(Response.OutputStream);
             }
        }
    }
    

    And here's how you display it:

    <img src="/chart" alt="chart" />

    One thing you will need to do is to add a reference to System.Web.UI.Datavisualization.Charting to your site. If you are using WebMatrix, you can use the Add Existing Item option to copy it to your bin folder. Look for  System.Web.DataVisualization.dll in C:\Windows\Microsoft.NET\Framework\v4.0.30319.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, February 18, 2015 4:03 AM
  • User325035487 posted

    Thank you so much sir. You're a life saver. I ditched webmatrix long time back based on your advise. I am using VS 2013 and SQL Server.

    Wednesday, February 18, 2015 9:22 AM