none
Device pixels vs. point values, specifically with a range bar chart

    Question

  • I have a range bar chart where one bar is always supposed to be collapsed to a line (the actual value). The other bar shows the statistical uncertainty. No matter how "infinitesimally" small I make the range of the blue bar, there are always instances where the resulting output will be two pixels wide on the screen, whereas in most cases it will be one pixel wide. This is annoying and does not look right.

    I suspect that this is caused by the rounding of the boundary values to whatever the available pixel resolution of the output image is. In other words, if one device pixel maps to .7 on my chart axis, maybe .699 is rounded to the 0 pixel, and .701 is rounded to the 1 pixel. Every once in a while the data will produce such a situation.

    I am wondering if there is a way to detect this and manipulate my data accordingly to avoid such inconsistencies.

    Using the same values for the upper and lower boundary will cause the line to not show at all

    Tuesday, May 26, 2009 10:49 PM

Answers

  • This effect may be caused by the anti-aliasing when position of the single pixel line fells on the pixel boundaries. In this case, line is drawn in both pixels with less intense color.

    You can try turning off anti-aliasing : Chart1.AntiAliasing = AntiAliasingStyle.None;

    If nothing works, you can always use custom painting event Chart.PostPaint to render those lines on top of the data points exactly as you need them.

    Alex.
    http://blogs.msdn.com/alexgor
    • Marked as answer by cdonner Thursday, May 28, 2009 8:35 PM
    Wednesday, May 27, 2009 4:14 AM
    Owner
  • Since this was only a prototype, I am fine with the current results. Otherwise I would go the custom drawing route. Thanks for your assistance.
    Wednesday, May 27, 2009 4:19 PM

All replies

  • Try this:

    Chart1.Series[0]["MaxPixelPointWidth"] = "1";


    Alex.
    http://blogs.msdn.com/alexgor
    Tuesday, May 26, 2009 11:09 PM
    Owner
  • I use  
    Chart1.Series["Score"]["PointWidth"] = "0.8"; 
    
    Chart1.Series["SampleSize"]["PointWidth"] = "0.3";

     

    By following your suggestion, my vertical line is reduced to a single pixel, but in some cases, the single pixel still is two pixels wide. So it not only has undesirable side effects, but does not seem to address the issue at all.

    Here is what I am trying to do, since it is not obvious from the magnification above. As you can see, the fifth data point from the top shows this very behavior.
    THe axis range is 0 to 100. This is what I do to set the value:

    Chart1.Series["Score"].Points.AddXY(i, point - 0.001, point);
    


    • Edited by cdonner Tuesday, May 26, 2009 11:32 PM
    Tuesday, May 26, 2009 11:21 PM
  • This effect may be caused by the anti-aliasing when position of the single pixel line fells on the pixel boundaries. In this case, line is drawn in both pixels with less intense color.

    You can try turning off anti-aliasing : Chart1.AntiAliasing = AntiAliasingStyle.None;

    If nothing works, you can always use custom painting event Chart.PostPaint to render those lines on top of the data points exactly as you need them.

    Alex.
    http://blogs.msdn.com/alexgor
    • Marked as answer by cdonner Thursday, May 28, 2009 8:35 PM
    Wednesday, May 27, 2009 4:14 AM
    Owner
  • Alex,
    It is not anti-aliasing, since the lines are vertical. Turning it off did not change anything.

    I put a slider on the page that controls a zoom factor, and as I zoom in and out, I can see the effect changing. It is pretty obvious that if the start and end points fall on two different pixels based on the scaling algorithm, the control will draw a line that is two pixels wide, even if the actual data would require a line that is much, much shorter than one pixel. A line that is much shorter than one pixel in real-world coordinates should not be two pixels wide on the image.

    I would not go as far as calling this a bug, but it is something that could be addressed by the control. The drawing algorithm should calculate the pixel location based on the data values, but it should also consider the distance between two points and make an adjustment if necessary, so that the overall chart is consistent to the human eye.

    I can see the same effect in the height of the gray bars, but it is less noticable there.

    The charts are now online: http://bishowcase.podconsulting.net/

    Overall, this is an awesome product!

    Christian
    Wednesday, May 27, 2009 1:02 PM
  • I agree. Do you want to investigate custom drawing option or you fine with the current results?

    Alex.
    http://blogs.msdn.com/alexgor
    Wednesday, May 27, 2009 2:57 PM
    Owner
  • Since this was only a prototype, I am fine with the current results. Otherwise I would go the custom drawing route. Thanks for your assistance.
    Wednesday, May 27, 2009 4:19 PM