Hi, I want to make a chart that has one column series and one line series in same chart. I also want to use the same two axis(x,y).
Lets say I have this dataset:
Col1 | Col2 | Col33400 | 4322 | 12300 | 1000 | 25994 | 1400 | 3
I want column 3 to be my x axis labels(string i know )
Column 1 is to be shown in my chart as columns
Column 2 is to be shown in my chart as a line.
Col 1 is budget amount, col2 is realAmount and col 3 is period (month)
The result Im after should look exacly like a Column Line Chart, but not have the same functionality.
Hope someone can help me.
I tried adding two different YXseries, but that didn't work. Maybe layering is what I need.
I'm getting really frustrated with the lack of documentation. Sure, there is plenty info on data members, but what I REALLY need is simple how to guides or examples that show how to use the different datamembers and functions.
THX
Geir
DataTable dt = new DataTable();dt.Columns.Add("col1", typeof(int));dt.Columns.Add("col2", typeof(int));dt.Columns.Add("col3", typeof(string));dt.Rows.Add(new object[ {3400, 4322, "1"});dt.Rows.Add(new object[ {2300, 1000, "2"});dt.Rows.Add(new object[ {5994, 1400, "3"});
AxisItem xAxisColumn = new AxisItem(this.ultraChart1, AxisNumber.X_Axis);AxisItem xAxisLine = new AxisItem(this.ultraChart1, AxisNumber.X_Axis);AxisItem yAxis = new AxisItem(this.ultraChart1, AxisNumber.Y_Axis);xAxisColumn.DataType = AxisDataType.String;xAxisColumn.SetLabelAxisType = SetLabelAxisType.GroupBySeries;xAxisColumn.Labels.ItemFormat = AxisItemLabelFormat.ItemLabel;xAxisLine.DataType = AxisDataType.String;xAxisLine.SetLabelAxisType = SetLabelAxisType.ContinuousData;yAxis.DataType = AxisDataType.Numeric;yAxis.Labels.ItemFormat = AxisItemLabelFormat.DataValue;area.Axes.Add(xAxisColumn);area.Axes.Add(xAxisLine);area.Axes.Add(yAxis);
ChartLayerAppearance columnLayer = new ChartLayerAppearance();columnLayer.AxisX = xAxisColumn;columnLayer.AxisY = yAxis;columnLayer.ChartArea = area;columnLayer.ChartType = ChartType.ColumnChart;columnLayer.Series.Add(seriesColumn);
this.ultraChart1.CompositeChart.ChartLayers.Add(columnLayer);this.ultraChart1.CompositeChart.ChartLayers.Add(lineLayer);
I am trying to so a similar chart. I have tried the ColumnLine chart but can not get it to work properly. Now I am trying to use a composite chart.
I tried the example from Max and it works, but I need to make a couple of changes. First I need two column data series with a legend for the column data.
For the line chart, I want to use a separate Y axis on the right of the chart.
I have attached a gif showing an example of how I want the chart to look.
I modified the code from Max as shown below. Now it only displays the line but no columns. Can someone please point out what I am doing wrong?
dt.Columns.Add("col1", GetType(Integer))
dt.Columns.Add("col3", GetType(Integer))
dt.Rows.Add(New Object() {2, 14, 12, "H1"})
dt.Rows.Add(New Object() {1, 9, 11, "H3"})
dt.Rows.Add(New Object() {4, 12, 9, "H5"})
dt.Rows.Add(New Object() {1, 8, 7, "H7"})
Me.UltraChart1.ChartType = ChartType.Composite
Me.UltraChart1.CompositeChart.ChartAreas.Add(area)
Dim xAxisLine As New AxisItem(Me.UltraChart1, AxisNumber.X_Axis)
xAxisColumn.DataType = AxisDataType.String
xAxisColumn.SetLabelAxisType = SetLabelAxisType.GroupBySeries
xAxisColumn.Labels.ItemFormat = AxisItemLabelFormat.ItemLabel
xAxisLine.DataType = AxisDataType.String
xAxisLine.SetLabelAxisType = SetLabelAxisType.ContinuousData
yAxis.DataType = AxisDataType.Numeric
yAxis.Labels.ItemFormat = AxisItemLabelFormat.DataValue
area.Axes.Add(xAxisColumn)
area.Axes.Add(xAxisLine)
area.Axes.Add(yAxis)
seriesColumn.Data.DataSource = dt
seriesColumn.Data.LabelColumn = "col4"
seriesColumn.Data.ValueColumn = "col2"
seriesColumn.Data.ValueColumn = "col3"
seriesLine.Data.DataSource = dt
seriesLine.Data.LabelColumn = "col4"
seriesLine.Data.ValueColumn = "col1"
ColumnLayer.AxisX = xAxisColumn
ColumnLayer.AxisY = yAxis
ColumnLayer.ChartArea = area
ColumnLayer.ChartType = ChartType.ColumnChart
'columnlayer.Series.
ColumnLayer.Series.Add(seriesColumn)
ColumnLayer.Series.Add(seriesColumn2)
LineLayer.AxisX = xAxisLine
LineLayer.AxisY = yAxis
LineLayer.ChartArea = area
LineLayer.ChartType = ChartType.LineChart
LineLayer.Series.Add(seriesLine)
Me.UltraChart1.CompositeChart.ChartLayers.Add(LineLayer)
Me.UltraChart1.ColumnChart.SeriesSpacing = 1
seriesColumn2 has no points in it. look at the sample code again and you'll find that you never set any properties on that object.
I attempted to replicate jb4854's chart in C# and I am getting the columns grouped as 2 separate series. I would actually like the columns to be group the same way as jb854's image above.
My code:
DataTable dt = new DataTable(); dt.Columns.Add("col1", typeof(Int32)); dt.Columns.Add("col2", typeof(Int32)); dt.Columns.Add("col3", typeof(Int32)); dt.Columns.Add("col4", typeof(String)); dt.Rows.Add(new object[] { 2, 14, 12, "H1" }); dt.Rows.Add(new object[] { 0, 11, 10, "H2" }); dt.Rows.Add(new object[] { 1, 9, 11, "H3" }); dt.Rows.Add(new object[] { 0, 10, 11, "H4" }); dt.Rows.Add(new object[] { 4, 12, 9, "H5" }); dt.Rows.Add(new object[] { 1, 11, 10, "H6" }); dt.Rows.Add(new object[] { 1, 8, 7, "H7" }); dt.Rows.Add(new object[] { 2, 10, 10, "H8" }); this.UltraChart4.ChartType = ChartType.Composite; ChartArea area = new ChartArea(); this.UltraChart4.CompositeChart.ChartAreas.Add(area); AxisItem xAxisColumn = new AxisItem(this.UltraChart4, AxisNumber.X_Axis); AxisItem xAxisLine = new AxisItem(this.UltraChart4, AxisNumber.X_Axis); AxisItem yAxis = new AxisItem(this.UltraChart4, AxisNumber.Y_Axis); xAxisColumn.DataType = AxisDataType.String; xAxisColumn.SetLabelAxisType = SetLabelAxisType.GroupBySeries; xAxisColumn.Labels.ItemFormat = AxisItemLabelFormat.ItemLabel; xAxisLine.DataType = AxisDataType.String; xAxisLine.SetLabelAxisType = SetLabelAxisType.ContinuousData; yAxis.DataType = AxisDataType.Numeric; yAxis.Labels.ItemFormat = AxisItemLabelFormat.DataValue; area.Axes.Add(xAxisColumn); area.Axes.Add(xAxisLine); area.Axes.Add(yAxis); NumericSeries seriesColumn = new NumericSeries(); seriesColumn.Data.DataSource = dt; seriesColumn.Data.LabelColumn = "col4"; seriesColumn.Data.ValueColumn = "col2"; NumericSeries seriesColumn2 = new NumericSeries(); seriesColumn2.Data.DataSource = dt; seriesColumn2.Data.LabelColumn = "col4"; seriesColumn2.Data.ValueColumn = "col3"; NumericSeries seriesLine = new NumericSeries(); seriesLine.Data.DataSource = dt; seriesLine.Data.LabelColumn = "col4"; seriesLine.Data.ValueColumn = "col1"; this.UltraChart4.Series.AddRange(new Infragistics.UltraChart.Data.Series.ISeries[]{ seriesLine, seriesColumn, seriesColumn2 }); ChartLayerAppearance columnLayer = new ChartLayerAppearance(); columnLayer.AxisX = xAxisColumn; columnLayer.AxisY = yAxis; columnLayer.ChartArea = area; columnLayer.ChartType = ChartType.ColumnChart; columnLayer.Series.Add(seriesColumn); columnLayer.Series.Add(seriesColumn2); ChartLayerAppearance lineLayer = new ChartLayerAppearance(); lineLayer.AxisX = xAxisLine; lineLayer.AxisY = yAxis; lineLayer.ChartArea = area; lineLayer.ChartType = ChartType.LineChart; lineLayer.Series.Add(seriesLine); this.UltraChart4.CompositeChart.ChartLayers.Add(columnLayer); this.UltraChart4.CompositeChart.ChartLayers.Add(lineLayer); this.UltraChart4.ColumnChart.SeriesSpacing = 1;
This is the chart that it produces:
How can I get the values for H1 in Series 1 and 2 to be displayed next to each and the same for the rest (H2, H3, etc..) similar to the way it is being represented in the previous post.
My thanks in advance for your help.
try this:
columnLayer.SwapRowsAndColumns = true;
Thanks David! That worked great.