Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
50
Chart with Y2 axis shows columns on top of each other
posted

I have a simple example chart to show the issue.  In a 2-series column chart, without using SecondaryY axis, the chart shows with the columns for each x axis data point next to each other, how we want it.  (see screenshot)  I have purposely set the values in the 2nd series to a different "range" than the 1st. 

When adding the AxisY property to the 2nd series, the sencond Y axis shows properly, but the columns for each series are lined up on top of each other.  (see screenshot)


Am I using the Axis settings incorrectly, or is this the expected behaivor?  If so, is there any way to get the columns next to each other when using 2 Y axes?



Dim dt As New DataTable()
dt.Columns.Add("Items", GetType(String))
dt.Columns.Add("Miles Column", GetType(Decimal))
dt.Columns.Add("Fillups Column", GetType(Decimal))

dt.Rows.Add("Item 1", 110, 20)
dt.Rows.Add("Item 2", 115, 30)
dt.Rows.Add("Item 3", 120, 40)
dt.Rows.Add("Item 4", 125, 55)

ultraChart1.ChartType = ChartType.Composite
ultraChart1.BackColor = Color.Black
ultraChart1.Data.ZeroAligned = True
ultraChart1.TitleTop.Text = "Miles to Fillups Analysis"
ultraChart1.TitleTop.FontColor = Color.Yellow
ultraChart1.TitleTop.Font = New Font("Arial", 14.0F)
ultraChart1.TitleTop.HorizontalAlign = StringAlignment.Center


' Create the Chart Area
Dim area As New ChartArea()
area.BoundsMeasureType = MeasureType.Percentage
area.Bounds = New Rectangle(25, 10, 74, 90)
area.Border.Thickness = 0


Dim xAxis As New AxisItem()

xAxis.OrientationType = AxisNumber.X_Axis
xAxis.DataType = AxisDataType.String
xAxis.SetLabelAxisType = SetLabelAxisType.GroupBySeries
xAxis.LineColor = Color.White
xAxis.Labels.SeriesLabels.Visible = False
xAxis.Labels.Visible = False
xAxis.MajorGridLines.Visible = False

Dim yAxis As New AxisItem()
yAxis.OrientationType = AxisNumber.Y_Axis
yAxis.Extent = 60
yAxis.TickmarkStyle = AxisTickStyle.Smart
yAxis.DataType = AxisDataType.Numeric
yAxis.LineColor = Color.White
yAxis.Labels.FontColor = Color.White
yAxis.Labels.ItemFormatString = "<DATA_VALUE:#0>"
yAxis.Labels.HorizontalAlign = StringAlignment.Far
yAxis.RangeType = AxisRangeType.Custom
yAxis.RangeMin = 100
yAxis.RangeMax = 200

Dim y2Axis As New AxisItem()
y2Axis.OrientationType = AxisNumber.Y2_Axis
y2Axis.Extent = 50
y2Axis.TickmarkStyle = AxisTickStyle.Smart
y2Axis.MajorGridLines.Visible = False
y2Axis.DataType = AxisDataType.Numeric
y2Axis.LineColor = Color.White
y2Axis.Labels.FontColor = Color.White
y2Axis.Labels.ItemFormatString = "<DATA_VALUE:#0>"
y2Axis.RangeType = AxisRangeType.Custom
y2Axis.RangeMin = 0
y2Axis.RangeMax = 60


Dim columnSeries As New NumericSeries()
columnSeries.DataBind(dt, "Miles Column", "Items")
columnSeries.PEs.Add(New PaintElement(Color.Gold))
columnSeries.Label = "Miles Column"


Dim columnSeries2 As New NumericSeries()
columnSeries2.DataBind(dt, "Fillups Column", "Items")
columnSeries2.PEs.Add(New PaintElement(Color.Red))
columnSeries2.Label = "Fillups Column"

Dim ColumnLayer As New ChartLayerAppearance()
ColumnLayer.ChartType = ChartType.ColumnChart
ColumnLayer.Series.Add(columnSeries)
ColumnLayer.ChartArea = area
ColumnLayer.AxisX = xAxis
ColumnLayer.AxisY = yAxis
ColumnLayer.AxisY2 = y2Axis
ColumnLayer.SwapRowsAndColumns = True

Dim ColumnLayer2 As New ChartLayerAppearance()
ColumnLayer2.ChartType = ChartType.ColumnChart
ColumnLayer2.Series.Add(columnSeries2)
ColumnLayer2.ChartArea = area
ColumnLayer2.AxisX = xAxis
ColumnLayer2.AxisY = y2Axis
ColumnLayer2.SwapRowsAndColumns = True

area.Axes.Add(xAxis)
area.Axes.Add(yAxis)
area.Axes.Add(y2Axis)
ultraChart1.CompositeChart.ChartAreas.Add(area)
ultraChart1.CompositeChart.ChartLayers.Add(ColumnLayer)
ultraChart1.CompositeChart.ChartLayers.Add(ColumnLayer2)
ultraChart1.CompositeChart.Series.Add(columnSeries)
ultraChart1.CompositeChart.Series.Add(columnSeries2)