Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Ugly drawing of MS asp.net radar chart

I'm using the MS asp.net charting controls. And I'm using the radar chart to draw some values, but for some reason, the lines of the X-axis doesn't really meet in the middle.

I have set the LineWidth = 1, but the line still takes like 2 pixels and some of the markers are totally off, or maybe it's the line that's totally off. Maybe my text is a little bit off as well, so please see picture and hopefully you'll understand my problem. =)

enter image description here

Code that generates the chart:

// Populate series data
Chart chart1 = new Chart();
chart1.ChartAreas.Add(new ChartArea("ChartArea1"));

chart1.Height = new Unit(380);
chart1.Width = new Unit(880);
//chart1.AntiAliasing = AntiAliasingStyles.Graphics;  
//chart1.BackColor = Color.Transparent;
chart1.Customize += new EventHandler(Chart_Customize);

// Show as 3D
chart1.ChartAreas["ChartArea1"].Area3DStyle.Enable3D = false;
chart1.ChartAreas["ChartArea1"].AxisY.IntervalAutoMode
    = IntervalAutoMode.FixedCount;
chart1.ChartAreas["ChartArea1"].AxisY.Interval = 10;
chart1.ChartAreas["ChartArea1"].AxisY.Maximum = 100;

chart1.ChartAreas["ChartArea1"].AxisY.IsReversed = true;

chart1.ChartAreas[0].AxisY.LineWidth = 1;
chart1.ChartAreas[0].AxisY.MajorGrid.LineColor = Color.Gray;
chart1.ChartAreas[0].AxisY.LineColor = Color.Gray;
chart1.ChartAreas[0].AxisY.MajorTickMark.Enabled = false;

List<string> names = new List<string>();
int namecounter = 1;
foreach (var p in Model.Participants)
{
  if (SessionHandle.ShowNamesInDiagrams)
    names.Add(p.Person.Name);
  else
    names.Add(namecounter.ToString());
  namecounter++;
}

#region firstresult
if (SessionHandle.ShowFirstResult)
{
  chart1.Series.Add(new Series("FirstResult"));
  List<double> firstresult = new List<double>();
  foreach (var p in Model.Participants)
  {
    var resultSummary = from r in Model.ResultSummary
                        where r.userID == p.ParentID && Model
                            .Modules
                            .Where(x => x.hasResult)
                            .ToList()
                            .Exists(x => x.ID == r.moduleID)
                        select r;
    firstresult.Add(resultSummary.Sum(x => x.scorePercent)
                    / Model.Modules.Where(x => x.hasResult).Count());
  }

  chart1.Series["FirstResult"].Points.DataBindXY(names, firstresult);
  // Set radar chart type
  chart1.Series["FirstResult"].ChartType = SeriesChartType.Radar;

  // Set radar chart style (Area, Line or Marker)
  chart1.Series["FirstResult"]["RadarDrawingStyle"] = "Marker";
  chart1.Series["FirstResult"].Color = Color.DarkBlue;
  chart1.Series["FirstResult"].MarkerImage
      = Url.Content("~/Content/Images/firstresult.png");

  // Set circular area drawing style (Circle or Polygon)
  chart1.Series["FirstResult"]["AreaDrawingStyle"] = "Circle";

  // Set labels style (Auto, Horizontal, Circular or Radial)
  chart1.Series["FirstResult"]["CircularLabelsStyle"] = "Horizontal";
}
#endregion
like image 613
Markus Avatar asked Feb 17 '11 14:02

Markus


1 Answers

WPF coordinates refer to the center of the pixel, not the corners, so try adding 0.5 to all your coordinates. To show this is the case consider the following xaml:

<Canvas>
<Line X1="50" Y1="50" X2="100" Y2="50" Stroke="Black" StrokeThickness="1" />
<Line X1="50" Y1="50" X2="50" Y2="100" Stroke="Black" StrokeThickness="1" />
<Line X1="50" Y1="50" X2="100" Y2="100" Stroke="Black" StrokeThickness="1" />
</Canvas>

Here it is rendered normally and then with a 0.5 pixel offset applied to each coordinate:

Xaml lines

like image 59
Mark Feldman Avatar answered Nov 12 '22 14:11

Mark Feldman