Barchart issue with aligning the bars with the custom ticks
Posted: Fri Sep 21, 2018 9:51 pm
Hi Team,
I am currently working on bar chart with custom ticks. I have an issue in aligning the bars with the custom ticks. If you could help me out with that it would be great.
Please find the image attached to get a clear picture of the issue.
I am using the below function to find the x-axis width. I have set the x-axis min as 0 and maximum as 1000 using setRange() function.
private double GetXAixsWidth(LightningChartUltimate _chart)
{
var min = _chart.ViewXY.XAxes[0].ValueToCoordD(_chart.ViewXY.XAxes[0].Minimum);
var max = _chart.ViewXY.XAxes[0].ValueToCoordD(_chart.ViewXY.XAxes[0].Maximum);
return max - min;
}
I am using the below function to set the width of the bar in the bar series.
private void SetBarsWidth(List<double> xValues)
{
List<double> xValues = new List<double> xValues{0,150,300,400,500,700,850,900,1000};
var xAxisWidth = GetXAixsWidth(_chart);
var denom = (double)(xValues.Last() - xValues.First());
var propWidth = xAxisWidth / denom;
for (int index = 0; index < _chart.ViewXY.BarSeries.Count; index++)
{
double cVal = xValues[index + 1] - xValues[index];
var bWid = (double)(cVal * propWidth);
_chart.ViewXY.BarSeries[index].BarThickness = (int)Math.Ceiling(bWid);
}
}
In the above code I am trying to find the total width of the X-axis and find the range of value by subtracting the last first value in the XValues with the last values in the XValues. On dividing the total width by range we are getting the proportional width which is being multiplied with the difference between adjacent values in the XValues to find the appropriate width of the bar based upon the difference in the adjacent values. Please find the below example to understand the approach used to fix the width of the bar.
Example:
XAxisWidth =1200
denom =1000
propWidth = 1200/1000= 1.2
First Bar Width = ((150-100)*1.2) = 60
Second Bar Width = ((300-150)*1.2) = 180
With the above approach I am getting little deviation in the alignment of the bar with the custom ticks, which is highlighted using red box in the attached image file. BarThickness in BarSeries is expecting the width in pixels (integer value) and the ValueToCoordD is returning the coordinate value (float value). On converting float value to integer we are getting a slight variation in the value which makes the alignment of the bar slightly before or after the custom ticks.
Kindly help me out to getting the exact pixel value of the custom ticks or guide me if there is any other approach to fix this issue.
I am currently working on bar chart with custom ticks. I have an issue in aligning the bars with the custom ticks. If you could help me out with that it would be great.
Please find the image attached to get a clear picture of the issue.
I am using the below function to find the x-axis width. I have set the x-axis min as 0 and maximum as 1000 using setRange() function.
private double GetXAixsWidth(LightningChartUltimate _chart)
{
var min = _chart.ViewXY.XAxes[0].ValueToCoordD(_chart.ViewXY.XAxes[0].Minimum);
var max = _chart.ViewXY.XAxes[0].ValueToCoordD(_chart.ViewXY.XAxes[0].Maximum);
return max - min;
}
I am using the below function to set the width of the bar in the bar series.
private void SetBarsWidth(List<double> xValues)
{
List<double> xValues = new List<double> xValues{0,150,300,400,500,700,850,900,1000};
var xAxisWidth = GetXAixsWidth(_chart);
var denom = (double)(xValues.Last() - xValues.First());
var propWidth = xAxisWidth / denom;
for (int index = 0; index < _chart.ViewXY.BarSeries.Count; index++)
{
double cVal = xValues[index + 1] - xValues[index];
var bWid = (double)(cVal * propWidth);
_chart.ViewXY.BarSeries[index].BarThickness = (int)Math.Ceiling(bWid);
}
}
In the above code I am trying to find the total width of the X-axis and find the range of value by subtracting the last first value in the XValues with the last values in the XValues. On dividing the total width by range we are getting the proportional width which is being multiplied with the difference between adjacent values in the XValues to find the appropriate width of the bar based upon the difference in the adjacent values. Please find the below example to understand the approach used to fix the width of the bar.
Example:
XAxisWidth =1200
denom =1000
propWidth = 1200/1000= 1.2
First Bar Width = ((150-100)*1.2) = 60
Second Bar Width = ((300-150)*1.2) = 180
With the above approach I am getting little deviation in the alignment of the bar with the custom ticks, which is highlighted using red box in the attached image file. BarThickness in BarSeries is expecting the width in pixels (integer value) and the ValueToCoordD is returning the coordinate value (float value). On converting float value to integer we are getting a slight variation in the value which makes the alignment of the bar slightly before or after the custom ticks.
Kindly help me out to getting the exact pixel value of the custom ticks or guide me if there is any other approach to fix this issue.