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
860
Two columns layers in UltraWinChart on Y and Y2
posted

Hello

I need a column chart showing two columns; one show percent (0-100), the other count (>1000). Percent should be shown on Y axis and count on Y2 axis. 

However I am having trouble doing this, it will only show one of the columns. 

My code looks like this:

InitializeComponent();

            this.ultraChart1.ChartType = Infragistics.UltraChart.Shared.Styles.ChartType.Composite;
            var chartArea = new ChartArea();
            this.ultraChart1.CompositeChart.ChartAreas.Add(chartArea);

            // Create x-axis
            var axisX = new AxisItem();
            axisX.OrientationType = Infragistics.UltraChart.Shared.Styles.AxisNumber.X_Axis;
            axisX.DataType = Infragistics.UltraChart.Shared.Styles.AxisDataType.String;
            
            // Create axis Y to show number between 0-100
            var axisY = new AxisItem();
            axisY.OrientationType = Infragistics.UltraChart.Shared.Styles.AxisNumber.Y_Axis;
            axisY.DataType = Infragistics.UltraChart.Shared.Styles.AxisDataType.Numeric;
            axisY.Labels.ItemFormatString = "<DATA_VALUE:0>";
            axisY.RangeType = AxisRangeType.Custom;
            axisY.RangeMin = 0;
            axisY.RangeMax = 100;

            // Create axis Y2 to show number between 1000-10000
            var axisY2 = new AxisItem();
            axisY2.OrientationType = Infragistics.UltraChart.Shared.Styles.AxisNumber.Y2_Axis;
            axisY2.DataType = Infragistics.UltraChart.Shared.Styles.AxisDataType.Numeric;
            axisY2.RangeType = AxisRangeType.Custom;
            axisY2.RangeMin = 1000;
            axisY2.RangeMax = 10000;
            axisY2.Labels.ItemFormatString = "<DATA_VALUE:0>";

            chartArea.Axes.Add(axisX);
            chartArea.Axes.Add(axisY);
            chartArea.Axes.Add(axisY2);

            // Add column layers for both Y and Y2
            ChartLayerAppearance columnLayerPercent = new ChartLayerAppearance();
            columnLayerPercent.ChartType = ChartType.ColumnChart;
            columnLayerPercent.ChartArea = chartArea;
            columnLayerPercent.AxisX = axisX;
            columnLayerPercent.AxisY = axisY;

            ChartLayerAppearance columnLayerCount = new ChartLayerAppearance();
            columnLayerCount.ChartType = ChartType.ColumnChart;
            columnLayerCount.ChartArea = chartArea;
            columnLayerCount.AxisX = axisX;
            columnLayerCount.AxisY2 = axisY2;

            this.ultraChart1.CompositeChart.ChartLayers.Add(columnLayerPercent);
            this.ultraChart1.CompositeChart.ChartLayers.Add(columnLayerCount);

            var testData = GetTestData();

            foreach (var numericItem in testData)
            {
                NumericSeries s = new NumericSeries();
                s.Label = numericItem.Timestamp.ToShortDateString();
                s.Points.Add(new NumericDataPoint(numericItem.ValuePercent, "Percent", false));
                columnLayerPercent.Series.Add(s);
            }

            foreach (var numericItem in testData)
            {
                NumericSeries s = new NumericSeries();
                s.Label = numericItem.Timestamp.ToShortDateString();
                s.Points.Add(new NumericDataPoint(numericItem.ValueCount, "Count", false));
                columnLayerCount.Series.Add(s);
            }

 3583.Source.zip

The code creates a chart with one X and two Y axis. 

I am 100% sure numericItem.ValueCount has values. 

Any ideas?

Parents
  • 29105
    Offline posted

    Hello Rasmus, 

    Thank you for contacting Infragistics. Is the formatting that is missing on Y2, it's not a percent?

    If so then you should do something like this instead:

    ultraChart1.Axis.Y.Labels.ItemFormat = Infragistics.UltraChart.Shared.Styles.AxisItemLabelFormat.Custom;

    ultraChart1.Axis.Y.Labels.ItemFormatString ="<PERCENT_VALUE:#0.00>";

    Otherwise please clarify what the image is representing from what you do want. 

Reply Children