Hi,
I'm currently working on a project that uses Composite Charts. I've seen a couple of examples on the forum and I tried to reproduce a Composite chart composed of a Column Chart and a Line chart. When I excute the code, I can see the Colums, the X and Y Axis of the column chart. I also obtain the X and Y2 axis for my Line chart, but I never see the line on my chart. The line never appear but the data is good and I don't really understand why it doesn't work. Can someone help me with this?Here's the code
The object chtMainGraph is my Infragistics.Win.UltraWinChart.UltraChart objectThe oCurrentGraph.GetData() returns this data
Mois CoutVoulu
janvier 12 février 15 mars 18 avril 21 mai 24 juin 27 juillet 30 août 33 septembre 36 octobre 39
The oCurrentGraph.GetSecondaryData() returns
Mois2 CoutVoulu2
janvier 16 février 20 mars 24 avril 28 mai 32 juin 36 juillet 40 août 44 septembre 48 octobre 52
I checked the data and everything is valid
------------------------------------
chtMainGraph.CompositeChart.ChartAreas.Add(area1)
xaxis.OrientationType = UltraChart.Shared.Styles.AxisNumber.X_Axis
xaxis.DataType = UltraChart.Shared.Styles.AxisDataType.String
xaxis.Labels.ItemFormat = UltraChart.Shared.Styles.AxisItemLabelFormat.ItemLabel
xaxis.SetLabelAxisType = UltraChart.Core.Layers.SetLabelAxisType.GroupBySeries
xaxis.Labels.Layout.Behavior = UltraChart.Shared.Styles.AxisLabelLayoutBehaviors.Auto
xaxis.Labels.Orientation = UltraChart.Shared.Styles.TextOrientation.Horizontal
yaxis.OrientationType = UltraChart.Shared.Styles.AxisNumber.Y_Axis
yaxis.DataType = UltraChart.Shared.Styles.AxisDataType.Numeric
yaxis.Labels.ItemFormat = UltraChart.Shared.Styles.AxisItemLabelFormat.DataValue
yaxis.SetLabelAxisType = UltraChart.Core.Layers.SetLabelAxisType.GroupBySeries
yaxis.Labels.Layout.Behavior = UltraChart.Shared.Styles.AxisLabelLayoutBehaviors.Auto
yaxis.Labels.Orientation = UltraChart.Shared.Styles.TextOrientation.Horizontal
yaxis.RangeType = UltraChart.Shared.Styles.AxisRangeType.Custom
yaxis.RangeMin = 0
yaxis.RangeMax = 75
xaxis2.OrientationType = UltraChart.Shared.Styles.AxisNumber.X_Axis
xaxis2.DataType = UltraChart.Shared.Styles.AxisDataType.String
xaxis2.SetLabelAxisType = UltraChart.Core.Layers.SetLabelAxisType.ContinuousData
yaxis2.OrientationType = UltraChart.Shared.Styles.AxisNumber.Y2_Axis
yaxis2.DataType = UltraChart.Shared.Styles.AxisDataType.Numeric
yaxis2.Labels.ItemFormat = UltraChart.Shared.Styles.AxisItemLabelFormat.DataValue
yaxis2.SetLabelAxisType = UltraChart.Core.Layers.SetLabelAxisType.ContinuousData
yaxis2.RangeMin = 0
yaxis2.RangeMax = 150
chtMainGraph.ChartType = UltraChart.Shared.Styles.ChartType.Composite
Dim appearenceColumn As New UltraChart.Resources.Appearance.ChartLayerAppearance()
seriesColumn.Data.DataSource = oCurrentGraph.GetData()
seriesColumn.Data.LabelColumn = "Mois"
seriesColumn.Data.ValueColumn = "CoutVoulu"
seriesLine.Data.LabelColumn = "Mois2"
seriesLine.Data.ValueColumn = "CoutVoulu2"
appearenceColumn.ChartArea = area1
appearenceColumn.Series.Add(seriesColumn)
appearenceColumn.AxisX = xaxis
appearenceColumn.AxisY = yaxis
appearenceLine.ChartType = UltraChart.Shared.Styles.ChartType.ColumnChart
appearenceLine.ChartArea = area1
appearenceLine.Series.Add(seriesLine)
appearenceLine.AxisX = xaxis2
appearenceLine.AxisY2 = yaxis2
chtMainGraph.CompositeChart.ChartLayers.Add(appearenceLine)
area1.Axes.Add(xaxis)
area1.Axes.Add(yaxis)
area1.Axes.Add(xaxis2)
area1.Axes.Add(yaxis2)
chtMainGraph.Series.AddRange(New Infragistics.UltraChart.Data.Series.ISeries() {seriesLine, seriesColumn})
chtMainGraph.Series.DataBind()
The result I get is the image attached to this post
Thanks for your answer.
yannh,
You are setting appearanceLine.axisX and axisY2 instead of axisY. Change the one line of code to the following:
appearenceLine.AxisY = yaxis2
and you will see your second layer. The second layer will be using the Y2 axis on the right as its Y axis. On a side note, you have also set appearenceLine's ChartType to ColumnChart. If you want to see a LineChart, change the ChartType to LineChart.
Kim, I changed the lines you telled me but I get the same result. I never get the line on my graphic.
Sorry for the ColumnChart ChartType on the appearenceLine, it was a copy/paste mistake I made when I copied the code on the forum.
Here's my code with the modified lines if you want to look at it:
yaxis.OrientationType = UltraChart.Shared.Styles.AxisNumber.Y2_Axis
yaxis2.OrientationType = UltraChart.Shared.Styles.AxisNumber.Y_Axis
Dim seriesLine As New UltraChart.Resources.Appearance.NumericSeries
appearenceLine.ChartType = UltraChart.Shared.Styles.ChartType.LineChart
Thanks
First, you will have to make your x axis use continuous data (requirement for line chart axes). You can do this by setting SetLabelAxisType to ContinuousData on your X axis. Otherwise, you can only plot column charts.
Also, XYSeries cannot be used for line charts. Only NumericSeries and NumericTimeSeries. XYSeries are for scatter charts.
Each layer that you want to display in the legend must be added to compositeLegend.ChartLayers collection.
Lastly, your series object needs to have its Label property set. Series without series labels are not displayed in the legend.
I have a similar problem. Here is the markup:
<ig:UltraChart runat="server" ID="chartUtilization" ChartType="Composite" Width="450px" Height="300px" BackgroundImageFileName="" BorderColor="Black" BorderWidth="1px" EmptyChartText="Data Not Available. Please call UltraChart.Data.DataBind() after setting valid Data.DataSource" Version="8.1"> <CompositeChart> <ChartAreas> <igchartprop:ChartArea Key="MainArea" Bounds="0,0,450,270" Border-Thickness="0"> <Axes> <igchartprop:AxisItem Key="XAxis" Extent="20" DataType="String" OrientationType="X_Axis"> <MajorGridLines Visible="True" DrawStyle="Dot" Color="Gainsboro" Thickness="1" AlphaLevel="255"> </MajorGridLines> <MinorGridLines Visible="False" DrawStyle="Dot" Color="LightGray" Thickness="1" AlphaLevel="255"> </MinorGridLines> <Labels ItemFormatString="" HorizontalAlign="Near" VerticalAlign="Center" Orientation="Horizontal"> <SeriesLabels HorizontalAlign="Center" VerticalAlign="Center" Orientation="Horizontal"> </SeriesLabels> </Labels> </igchartprop:AxisItem> <igchartprop:AxisItem Key="YAxis" Extent="30" DataType="Numeric" OrientationType="Y_Axis"> <MajorGridLines Visible="True" DrawStyle="Dot" Color="Gainsboro" Thickness="1" AlphaLevel="255"> </MajorGridLines> <MinorGridLines Visible="False" DrawStyle="Dot" Color="LightGray" Thickness="1" AlphaLevel="255"> </MinorGridLines> <Labels ItemFormatString="<DATA_VALUE:##>" HorizontalAlign="Near" VerticalAlign="Center" Orientation="Horizontal"> <SeriesLabels HorizontalAlign="Center" VerticalAlign="Center" Orientation="Horizontal"> </SeriesLabels> </Labels> </igchartprop:AxisItem> </Axes> <GridPE ElementType="None" /> <Border Thickness="0" /> </igchartprop:ChartArea> </ChartAreas> <ChartLayers> <igchartprop:ChartLayerAppearance ChartType="LineChart" Key="Utilization" AxisXKey="XAxis" AxisYKey="YAxis" SwapRowsAndColumns="true" ChartAreaKey="MainArea" SeriesList="series1"> <ChartTypeAppearances> <igchartprop:LineChartAppearance Thickness="1"> </igchartprop:LineChartAppearance> </ChartTypeAppearances> </igchartprop:ChartLayerAppearance> </ChartLayers> <Legends> <igchartprop:CompositeLegend Bounds="10,265,430,25" /> </Legends> </CompositeChart> </ig:UltraChart>
For the code behind i tried this:
XYSeries nsUtilization = new XYSeries { Label = "Utilization" }, nsChargeability = new XYSeries { Label = "Chargeability" }; nsUtilization.PEs.Add(new PaintElement(Color.Blue)); nsChargeability.PEs.Add(new PaintElement(Color.Red)); for (int i = 1; i <= 13; ++i) { double? util = dataUtilization.First(r => r.Actual.Period == i).Actual.USD , charg = dataChargeability.First(r => r.Actual.Period == i).Actual.USD; if (util == null || charg == null) continue; util = util.Value * 100; charg = charg.Value * 100; nsUtilization.Points.Add(new XYDataPoint(i, util.Value, i.ToString(), false)); nsChargeability.Points.Add(new XYDataPoint(i, charg.Value, i.ToString(), false)); } chartUtilization.CompositeChart.Series.Add(nsUtilization); chartUtilization.CompositeChart.ChartLayers[0].Series.Add(nsUtilization); chartUtilization.CompositeChart.Series.Add(nsChargeability); chartUtilization.CompositeChart.ChartLayers[0].Series.Add(nsChargeability);
And this:
NumericSeries nsUtilization; for (int i = 1; i <= 13; ++i) { double? util = dataUtilization.First(r => r.Actual.Period == i).Actual.USD , charg = dataChargeability.First(r => r.Actual.Period == i).Actual.USD; if (util == null || charg == null) continue; nsUtilization = new NumericSeries() { Label = i.ToString(), Visible = true, }; nsUtilization.PEs.Add(new PaintElement { Fill = Color.Red }); util = util.Value * 100; charg = charg.Value * 100; nsUtilization.Points.Add(new NumericDataPoint(util.Value, "Utilization", false) { PE = new PaintElement(Color.Blue) }); nsUtilization.Points.Add(new NumericDataPoint(charg.Value, "Chargeability", false) { PE = new PaintElement(Color.Red) }); chartUtilization.CompositeChart.Series.Add(nsUtilization); chartUtilization.CompositeChart.ChartLayers[0].Series.Add(nsUtilization); }
In both cases, I got a chart with correct X and Y tickmarks/range but no lines and legend is empty. Any ideas?
I believe I found the issue- in your GetSecondaryData() function, the integer values are all negative. You have defined both Y axes to have positive values, so you never see the negative values in your chart. Change the integer values to be positive, and you should see the line in your chart.
Hi Max,I did what you told me. I created a new project with the same code but the result is still the same... I don't know what to do... Then I give you all the code I have done to obtain the wrong result. If you have an idea or anything to try, I'm wide open. Here are the only two files I have in my vb windows application.
My Form1.vb file
Imports Infragistics
InitializeComponent()
yaxis2.RangeType = UltraChart.Shared.Styles.AxisRangeType.Custom
seriesColumn.Data.DataSource = GetData()
seriesLine.Data.DataSource = GetSecondaryData()
appearenceColumn.ChartType = UltraChart.Shared.Styles.ChartType.ColumnChart
chtMainGraph.CompositeChart.ChartLayers.Add(appearenceColumn)
End Sub
Dim bob As New DataTable()
bob.Columns.Add("Mois", System.Type.GetType("System.String"))
rowzz = bob.NewRow()
rowzz("Mois") = MonthName(i)
bob.Rows.Add(rowzz)
Next
End Function
bob.Columns.Add("Mois2", System.Type.GetType("System.String"))
rowzz("Mois2") = MonthName(i)
End Class
My Form1.Designer.vb file
----------------------------------------------------
<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()> _
Inherits System.Windows.Forms.Form
Protected Overrides Sub Dispose(ByVal disposing As Boolean)
Try
If disposing AndAlso components IsNot Nothing Then
components.Dispose()
End If
Finally
End Try
Private components As System.ComponentModel.IContainer
Me.components = New System.ComponentModel.Container
CType(Me.chtMainGraph, System.ComponentModel.ISupportInitialize).BeginInit()
Me.chtMainGraph.Location = New System.Drawing.Point(12, 12)
Me.chtMainGraph.Name = "chtMainGraph"
Me.chtMainGraph.TabIndex = 2
Me.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font
Me.Controls.Add(Me.chtMainGraph)
Me.Name = "Form1"
Me.ResumeLayout(False)