Hello,
Is there any way to rotate Box(Whisker chart) in Infragistic Win Forms UltraChart component so it would be horizontal?
Thanks in advance
Hello Oleksandr,
Thank you for contacting Infragistics Developer Support.
If you want to rotate the box chart horizontally, you could handle the FillSceneGraph event and get the GraphicsContext primitive. This primitive is basically responsible for drawing the rest of the primitives and it has a transform property. You can use this property to rotate the chart drawing (you need to rotate it by 90 degrees and translate its Y coordinate with the chart height). This way the chart will be rotated. Another thing you should do is to use the Y2 axis instead of the Y axis as when rotated, the Y2 axis will be in the place of the X axis. Also in order for the whole chart to be displayed after the rotation you should use a chart with equal height and width.
I have attached a sample in order to demonstrate this approach.
Please let me know if you have any additional questions.
It worked fine, thanks a lot! But now when I am trying to make it wider the height of control is also increases. So I can't make it for example Height 70 px and width 500 px. Can you suggest something?
Also I have several questions regarding different charts layout:
1. What it takes to get rid of gradient for bars and make it painted with solid color?
2. Is there any way to move "Data values on chart" so they will be not on the edge of bar(one digit inside the bar and another outside) but whole value inside the bar or outside?
3. Also this solution
foreach (Primitive item in e.SceneGraph)
{
Text pl = item as Text;
if (pl != null && pl.Path == "Border.Title.Grid.Y") {
pl.bounds.Offset(-15, 0); }
if (pl != null && pl.Path == "Border.Title.Grid.X") { pl.PE.Fill = Color.Green; pl.bounds.Offset(5, 15); } }
worked fine for lot of charts except for "Column chart"
Is there a way to move X Axis labels for "Column chart"?
Any help will be much appreciated.
P.S. I couldn't open solution that you attached. It looks like it was because I use VS 2010. If it is possible to attach solution that was built in the same studio it would be great. Thanks again.
Hi Oleksandr,
Thank you for the reply.
Generally we prefer each new issue to be reported in a separate thread. This way if other people are having similar issues or questions they will be able to search and find the thread, which answers the questions a lot easier. So in future please create separate threads for different issues, we will be glad to assist you in them :)
As for you questions:
1) In these case the separate columns are considered a different series (each row in the DataTable is a separate series). So the property you need to set is SeriesSpacing not ColumnSpacing
2) Yes, you can use a similar approach in order to create drop lines for SplineChart. The main difference between the two charts is that the SplineChart use a label X axis, while the ScatterChart – numeric X axis. This in turn means that the value of the points.Value property returns a double array for the ScatterChart and a single double value for the spline chart. So for the SplineChart, you will need to use the index of the point in order to find the x coordinate. You can get the index of the point using its Column property. As for the rest its fairly similar to the ScatterChart approach, the only other difference is that the main primitive is not a PoinSet, but a PolyLine.
3) If you want to dynamically reposition the labels, you should use the FillSceneGraph event again. You can recognize the Text primitives which are the data values by checking if they are contained inside the main chart area and checking if their Path is null. After that parse their string text to a double value and use the appropriate labelStyle.HorizontalAlignment based on your criteria. In my sample I positioned them based on the total range of the X axis (I also added an option for central alignment for your reference).
I have attached an archive containing 3 samples, one for each of your questions. For the sample with the drop line use the radio button to switch between the Spline and Scatter charts.
Please let me know if you have any additional questions on this matter.
Thanks a lot! And sorry for writing everything in one topic.
Hello Dimitar, sorry again for writing this in same post but it looks like you know better what I mean in my posts )
I have a question regarding composite chart. I have column chart an line chart combined just as you told me. But the question is can I provide separate datasource for each chart. Why I need this is because in my Line chart I want to draw for example 20 points, and for column chart 9 columns.
The code that I am trying to use is as following but it results in blank screen:
using System;using System.Collections.Generic;using System.ComponentModel;using System.Data;using System.Drawing;using System.Linq;using System.Text;using System.Windows.Forms;using Infragistics.UltraChart.Core.Layers;using Infragistics.UltraChart.Core.Primitives;using Infragistics.UltraChart.Resources.Appearance;using Infragistics.UltraChart.Shared.Styles;
namespace UltraChartLineChart.Charts{public partial class CombinedChart : Form{public CombinedChart(){InitializeComponent();}
private void CombinedChart_Load(object sender, EventArgs e){this.ultraChart1.ChartType = ChartType.Composite;
ChartArea histogramArea = new ChartArea();ChartArea lineArea = new ChartArea();this.ultraChart1.CompositeChart.ChartAreas.Add(histogramArea);this.ultraChart1.CompositeChart.ChartAreas.Add(lineArea);
AxisItem axisYhistogram = new AxisItem();axisYhistogram.Extent = 20;axisYhistogram.DataType = AxisDataType.Numeric;axisYhistogram.Labels.ItemFormatString = "<DATA_VALUE:##.##>";axisYhistogram.OrientationType = AxisNumber.Y_Axis;axisYhistogram.LineColor = Color.Silver;histogramArea.Axes.Add(axisYhistogram);
AxisItem axisXhistogram = new AxisItem();axisXhistogram.Extent = 20;axisXhistogram.DataType = AxisDataType.String;axisXhistogram.Labels.Orientation = TextOrientation.VerticalLeftFacing;axisXhistogram.Labels.ItemFormatString = "<ITEM_LABEL>";axisXhistogram.OrientationType = AxisNumber.X_Axis;axisXhistogram.SetLabelAxisType = SetLabelAxisType.GroupBySeries;axisXhistogram.LineColor = Color.Silver;histogramArea.Axes.Add(axisXhistogram);
AxisItem axisYnormalDistribution = new AxisItem();axisYnormalDistribution.Extent = 20;axisYnormalDistribution.DataType = AxisDataType.Numeric;axisYnormalDistribution.Labels.ItemFormatString = "<DATA_VALUE:##.##>";axisYnormalDistribution.OrientationType = AxisNumber.Y_Axis;axisYnormalDistribution.Visible = false;axisYnormalDistribution.LineColor = Color.Silver;lineArea.Axes.Add(axisYnormalDistribution);
AxisItem axisXnormalDistribution = new AxisItem();axisXnormalDistribution.Extent = 20;axisXnormalDistribution.DataType = AxisDataType.String;axisXnormalDistribution.Labels.Orientation = TextOrientation.VerticalLeftFacing;axisXnormalDistribution.Labels.ItemFormatString = "<ITEM_LABEL>";axisXnormalDistribution.Labels.Visible = false;axisXnormalDistribution.OrientationType = AxisNumber.X_Axis;axisXnormalDistribution.SetLabelAxisType = SetLabelAxisType.ContinuousData;axisXnormalDistribution.LineColor = Color.Silver;lineArea.Axes.Add(axisXnormalDistribution);
ChartLayerAppearance myColumnLayer = new ChartLayerAppearance();myColumnLayer.ChartType = ChartType.ColumnChart;myColumnLayer.SwapRowsAndColumns = true;myColumnLayer.ChartArea = histogramArea;
ChartLayerAppearance myLineLayer = new ChartLayerAppearance();myLineLayer.ChartType = ChartType.LineChart;myLineLayer.ChartArea = lineArea;
NumericSeries histogramSeries = new NumericSeries();histogramSeries.DataBind(GetHistogramData(), "Monthly Achieve");histogramSeries.PEs.Add(new PaintElement(Color.DimGray));myColumnLayer.Series.Add(histogramSeries);ultraChart1.CompositeChart.Series.Add(histogramSeries);
NumericSeries normalDestributionSeries = new NumericSeries();normalDestributionSeries.DataBind(GetNormalDestributionData(), "Cumm Plane", "Month");normalDestributionSeries.PEs.Add(new PaintElement(Color.Red));myLineLayer.Series.Add(normalDestributionSeries);ultraChart1.CompositeChart.Series.Add(normalDestributionSeries);
for (int i = 1; i < GetHistogramData().Rows.Count; i++){Override colorOverride = new Override();colorOverride.Column = -2;colorOverride.Row = i;colorOverride.PE = new PaintElement(Color.LightSlateGray);this.ultraChart1.Override.Add(colorOverride);}
ColumnChartAppearance appearance = new ColumnChartAppearance();appearance.SeriesSpacing = 0;myColumnLayer.ChartTypeAppearance = appearance;
myColumnLayer.AxisX = axisXhistogram;myColumnLayer.AxisY = axisYhistogram;this.ultraChart1.CompositeChart.ChartLayers.Add(myColumnLayer);
myLineLayer.AxisX = axisXnormalDistribution;myLineLayer.AxisY = axisYnormalDistribution;this.ultraChart1.CompositeChart.ChartLayers.Add(myLineLayer);}
private DataTable GetHistogramData(){DataTable lineDt = new DataTable();lineDt.Columns.Add("Month");lineDt.Columns.Add("Value", typeof(decimal));
lineDt.Rows.Add("Apr-10", 1.039381);lineDt.Rows.Add("May-10", 1.531703);lineDt.Rows.Add("Jun-10", 2.166947);lineDt.Rows.Add("Jul-10", 2.943036);lineDt.Rows.Add("Aug-10", 3.837218);lineDt.Rows.Add("Sep-10", 4.802984);lineDt.Rows.Add("Oct-10", 5.771378);lineDt.Rows.Add("Nov-10", 6.657660);lineDt.Rows.Add("Dec-10", 7.372884);
return lineDt;}private DataTable GetNormalDestributionData(){DataTable lineDt = new DataTable();lineDt.Columns.Add("Month");lineDt.Columns.Add("Cumm Plane", typeof(decimal));
lineDt.Rows.Add("Apr-10", 1.039381);lineDt.Rows.Add("May-10", 1.531703);lineDt.Rows.Add("Jun-10", 2.166947);lineDt.Rows.Add("Jul-10", 2.943036);lineDt.Rows.Add("Aug-10", 3.837218);lineDt.Rows.Add("Sep-10", 4.802984);lineDt.Rows.Add("Oct-10", 5.771378);lineDt.Rows.Add("Nov-10", 6.657660);lineDt.Rows.Add("Dec-10", 7.372884);lineDt.Rows.Add("Jan-11", 7.838389);lineDt.Rows.Add("Feb-11", 8.000000);lineDt.Rows.Add("Mar-11", 7.838389);lineDt.Rows.Add("Apr-11", 7.372884);lineDt.Rows.Add("May-11", 6.657660);lineDt.Rows.Add("Jun-11", 5.771378);lineDt.Rows.Add("Jul-11", 4.802984);lineDt.Rows.Add("Aug-11", 3.837218);lineDt.Rows.Add("Sep-11", 2.943036);lineDt.Rows.Add("Nov-11", 2.166947);lineDt.Rows.Add("Dec-11", 1.531703);
return lineDt;}
private void ultraChart1_FillSceneGraph(object sender, Infragistics.UltraChart.Shared.Events.FillSceneGraphEventArgs e){foreach (Primitive p in e.SceneGraph){Box bar = p as Box;if (bar != null){bar.PE.Stroke = Color.LightGray;}}}}}
Thanks in advance.
It seems that Mike has responded to you in this forum thread:
http://ko.infragistics.com/community/forums/p/92739/459314.aspx#459314
You need to bind the different series to the different data sources. The sample code you have provided is doing just that. You only need to add one small modification – change the following line (which is right after you initialize the histogramSeries):
histogramSeries.DataBind(GetHistogramData(), "Monthly Achieve");
to:
histogramSeries.DataBind(GetHistogramData(),"Value", "Month");
After doing that I was able to run your sample and the chart was with 9 columns and a line consisting of 20 points.
I am looking forward to your reply.
Hello, Dimitar. I am not sure if you saw my questions so I will duplicate them here if you don't mind
1)
Hello, I have another issue with the code above. The problem is with the Override object herefor (int i = 0; i < GetHistogramData().Rows.Count; i++){Override colorOverride = new Override();colorOverride.Column = -2;colorOverride.Row = i;colorOverride.PE = new PaintElement(Color.LightSlateGray);this.ultraChart1.Override.Add(colorOverride);}
what I want is that Line chart to be red collor and Column chart to be LightSlateGray. But when I use override for
colorOverride.Column = 0;
colorOverride.Row = 0;
it colors first column of column chart and whole line chart in the same color. So when I get Override through the foreach loop all columns in the column chart (it is desirable) and whole line chart (not desirable) have the same color, colors are merged and it is impossible to see the line when columns are on the background.
Is there a way to set different color for the line?
I was trying to do something like this but it didn't helped
for (int i = 0; i < GetHistogramData().Rows.Count; i++){Override colorOverrideline = new Override();colorOverrideline.Column = -2;colorOverrideline.Row = i;colorOverrideline.PE = new PaintElement(Color.Red);myLineLayer.ChartComponent.Override.Add(colorOverrideline);}
It colors whole control anyway
I also checked ZeroAlignData property via designer. BTW where can I find this property in the code?
2) Also while using column chart in ultraChart1_FillSceneGraph event I was able to get var axisX = e.Grid["X"] as IAdvanceAxis; but now when I use composite chart I get null here.
The same thing with labels angle. When I was using column chart I was able to set Axis.X.Labels.Orientation = Custom and than set angle of labels. Using composite chart this property takes no effect.
Can you advice something?
Thanks!