Point labels in stacked bar chart

[serious]

Hello,

I use stacked bar chart and try to use "prevent collisions" feature for the point labels.

In VS2008 designer everything looks fine, but in the browser some point labels are absent.

Here is my markup:

<AllSeries Gallery="Bar" PointLabels-Visible="True" Stacked="Normal"
  pointlabelorganizer-autoarrange="True" pointlabelorganizer-enabled="True">
  </AllSeries>

Browser chart screen shot is in the attachment.

Best regards, Oleg.

[serious]

The problem exists in pie charts too, "prevent collisions" doesn't work.Here is my markup: 

<chartfx7:Chart ID="TopAlertsChart" runat="server" Height="250px" RandomData-Series="2"    Width="750px" ContextMenus="False" DataSourceID="TopAlertsDataSource">    <SpecialObjects>	    <chartfx7galleries:Pie ExplodingMode="All" SliceSeparation="10" />    </SpecialObjects>    <DataSourceSettings>	    <Fields>		    <chartfx7:FieldMap DisplayName="This Month" Name="ThisMonth" Usage="Value" />		    <chartfx7:FieldMap DisplayName="Previous Month" Name="PrevMonth" Usage="Value" />		    <chartfx7:FieldMap DisplayName="Name" Name="Name" Usage="Label" />	    </Fields>    </DataSourceSettings>    <AllSeries Gallery="Pie" PointLabelOrganizer-AutoArrange="True" PointLabelOrganizer-Enabled="True"	    PointLabels-BackColor="Transparent" PointLabels-BorderColor="Transparent" 	    PointLabels-Visible="True">    </AllSeries>    <LegendBox Border="None" Dock="Bottom" PlotAreaOnly="False" Visible="False">    </LegendBox>    <View3D Enabled="True" />    <Series>	    <chartfx7:SeriesAttributes Text="This Month"></chartfx7:SeriesAttributes>	    <chartfx7:SeriesAttributes Text="Previous Month"></chartfx7:SeriesAttributes>    </Series>    <Titles>	    <chartfx7:TitleDockable Text="Top alerts distribution" Font="Arial, 8pt" />    </Titles></chartfx7:Chart> 

[maried]

For the stacked bar chart, try setting the LineAlignment for the PointLabels to be different for the series. For example, say there are 3 series in the chart:

Chart1.Series[0].PointLabels.LineAlignment = System.Drawing.StringAlignment.Center;

Chart1.Series[1].PointLabels.LineAlignment = System.Drawing.

StringAlignment.Far;

Chart1.Series[2].PointLabels.LineAlignment = System.Drawing.

StringAlignment.Near;

This will display the pointlabels at different positions for the stacked series.

For pie chart, this is expected behavior if the pointlabels are too long. Try displaying the PointLabels in 2 lines (or multiple lines) using the newline (\n) character:

Chart1.Series[0].PointLabels.Format =

"my pointlabel text \n series 0: %v";

[serious]

Thanks for the suggestion related to the pie charts. It seems to be acceptable for us.

As for stacked bar charts problems. Setting LineAligment property doesn't solve the problem. Setting Aligment works, but sometimes it may produce really confusing results.

See my screen shot for example. David Bowman has 0 Disapproved items, so this category is hidden in his bar, but point label is visible. Point labels for Reconciled and Disapproved categories look like one label, so user sees that there are 50 Reconciled items. This is not acceptable behavior.

Definitely, you should fix this bug with point labels layout. Please let me know if there is another workaround for this issue (I don't think it will be fixed quickly ).

Best regards, Oleg.

Here is my markup: 

<chartfx7:Chart ID="LowApproversChart" runat="server" Height="400px" DataSourceID="LowApproversDataSource"        RandomData-Series="8" Width="375px" ContextMenus="False">        <AxisX Title-Text="">        </AxisX>        <SpecialObjects>            <chartfx7galleries:Bar />        </SpecialObjects>        <DataSourceSettings>            <Fields>                <chartfx7:FieldMap DisplayName="Approved" Name="Approved" Usage="Value" />                <chartfx7:FieldMap DisplayName="Closed" Name="Closed" Usage="Value" />                <chartfx7:FieldMap DisplayName="Cancelled" Name="Cancelled" Usage="Value" />                <chartfx7:FieldMap DisplayName="Reconciled" Name="Reconciled" Usage="Value" />                <chartfx7:FieldMap DisplayName="Disapproved" Name="Disapproved" Usage="Value" />                <chartfx7:FieldMap DisplayName="Approval In Process" Name="ApprovalInProcess" Usage="Value" />                <chartfx7:FieldMap DisplayName="Pending Approval" Name="PendingApproval" Usage="Value" />                <chartfx7:FieldMap DisplayName="Open" Name="Open" Usage="Value" />                <chartfx7:FieldMap DisplayName="Name" Name="Name" Usage="Label" />            </Fields>        </DataSourceSettings>        <AllSeries Gallery="Bar" PointLabels-Visible="True" Stacked="Normal">        </AllSeries>        <LegendBox Dock="Bottom" Border="None">        </LegendBox>        <View3D Enabled="True" />        <Series>            <chartfx7:SeriesAttributes Text="Approved" PointLabels-Alignment="Far" />            <chartfx7:SeriesAttributes Text="Closed" />            <chartfx7:SeriesAttributes Text="Cancelled" PointLabels-Alignment="Near" />            <chartfx7:SeriesAttributes Text="Reconciled" PointLabels-Alignment="Far" />            <chartfx7:SeriesAttributes Text="Disapproved" />            <chartfx7:SeriesAttributes Text="Approval In Process" PointLabels-Alignment="Near"                PointLabels-LineAlignment="Far" />            <chartfx7:SeriesAttributes Text="Pending Approval" PointLabels-Alignment="Far" />            <chartfx7:SeriesAttributes Text="Open" />        </Series>        <Titles>            <chartfx7:TitleDockable Text="Top least active aprovers" />        </Titles>    </chartfx7:Chart>

[Frank]

Two things:

1) Organize Point Labels only has an effect on axes-based chart types. It has no effect on Pie charts. The problem you are having in the Pie is that space allocated for the labels is limited as a percentage of the total available space. This can be adjusted using the MaximumLabelMargin property in the Pie class.

2) The Organize Point Labels heuristic does not guarantee all labels will be shown. The algorithm is independent of the gallery type or the Stacked setting. The screenshots you posted show that is working as designed. I think what you are looking for is not going to be achivable using this feature. I don't see how, even doing it manually you can organize the labels on this chart making clear which label corresponds to which segment.

[serious]

Hi, Frank,

I agree that my case is a bit complex, and maybe it is not a situation your algorithm was designed for.

I don't see how, even doing it manually you can organize the labels on this chart making clear which label corresponds to which segment.

At least chart can hide empty categories, so "0" point label will not be shown (There is another disadvantage in current behavior: topmost empty category in the stacked bar chart is visible in 3D view). You should think about hiding empty categories in the charts. It may be a property in the component interface.

One more thing that prevent point labels displaying correctly sometimes is that the only option when they are always visible is LineAligment=Far. When we use LineAligment=Near labels are not shown sometimes, and with LineAligment=Center they are partially showed. You can easily reproduce this behavior in VS designer. I think if you will be able to address these issues, the algorithm may perform much better.

I realize that my ideas may be unacceptable for your components, but at least you should think about these things.

Information that your algorithm doesn't guarantee that all items should be shown was new for me. It would be great if you'll add it in the documentation.

Best regards, Oleg.

[serious]

Frank,

By the way, look at my first screen shot. There is a lot of space where to put point labels, but your algorithm didn't do this.

Best regards, Oleg

[Frank]

> At least chart can hide empty categories, so "0" point label will not be shown (There is another disadvantage in current behavior:

> topmost empty category in the stacked bar chart is visible in 3D view). You should think about hiding empty categories in the charts.

> It may be a property in the component interface.

Zero and empty are two different things. zero is like any other value. In many applications zero is very important. If you want to hide some segments you should assing null (chart.Hidden) to the value. If you are databinding the chart, any null values in your data will be taken as hidden values. So while hidding zero may seem like the obvious thing to do in this case it not always the case. However, Chart FX is open enough to acoomodate what you want. By simply creating a conditional attribute as follows you will hide the point labels for all zero values:

chart1.AllSeries.PointLabels.Visible = true;ConditionalAttributes ca = new ConditionalAttributes();

ca.Condition.From = -1;

ca.Condition.To = 1;

ca.Condition.FromOpen = ca.Condition.ToOpen = false;

ca.PointLabels.Visible =

false;

chart1.ConditionalAttributes.Add(ca);

> I realize that my ideas may be unacceptable for your components, but at least you should think about these things.

> Information that your algorithm doesn't guarantee that all items should be shown was new for me. It would be great if you'll add it in the documentation.

We welcome your ideas and although we need to worry about more generic cases as one single scenario, we would like to learn more about your case to determine how we can incorporate this into our product. So besides not showing zero, what do you think is the best way to arrange the labels in the chart posted by you previously if you were to do it by hand and what are the rules you used?

[serious]

Frank,

Thanks for pointing me out on Chart.Hidden field. It works.

I manually adjusted point labels layout for the specific chart data. All labels are visible, and user can determine which label belongs to which category. See the screenshot.

It is better to use PointLabels-LineAlignment="Center" for small categories, but currently it doesn't works (labels are clipped).

    <chartfx7:Chart ID="LowApproversChart" runat="server" Height="400px" DataSourceID="LowApproversDataSource"        RandomData-Series="8" Width="375px" ContextMenus="False">        <AxisX Title-Text="">        </AxisX>        <SpecialObjects>            <chartfx7galleries:Bar />        </SpecialObjects>        <DataSourceSettings>            <Fields>                <chartfx7:FieldMap DisplayName="Approved" Name="Approved" Usage="Value" />                <chartfx7:FieldMap DisplayName="Closed" Name="Closed" Usage="Value" />                <chartfx7:FieldMap DisplayName="Cancelled" Name="Cancelled" Usage="Value" />                <chartfx7:FieldMap DisplayName="Reconciled" Name="Reconciled" Usage="Value" />                <chartfx7:FieldMap DisplayName="Disapproved" Name="Disapproved" Usage="Value" />                <chartfx7:FieldMap DisplayName="Approval In Process" Name="ApprovalInProcess" Usage="Value" />                <chartfx7:FieldMap DisplayName="Pending Approval" Name="PendingApproval" Usage="Value" />                <chartfx7:FieldMap DisplayName="Open" Name="Open" Usage="Value" />                <chartfx7:FieldMap DisplayName="Name" Name="Name" Usage="Label" />            </Fields>        </DataSourceSettings>        <AllSeries Gallery="Bar" PointLabels-Visible="True" Stacked="Normal">        </AllSeries>        <LegendBox Dock="Bottom" Border="None">        </LegendBox>        <View3D Enabled="True" />        <Series>            <chartfx7:SeriesAttributes Text="Approved" PointLabels-Alignment="Far" />            <chartfx7:SeriesAttributes Text="Closed" PointLabels-Alignment="Near" />            <chartfx7:SeriesAttributes Text="Cancelled" PointLabels-Alignment="Near" />            <chartfx7:SeriesAttributes Text="Reconciled" PointLabels-Alignment="Far" />            <chartfx7:SeriesAttributes Text="Disapproved" PointLabels-Alignment="Center"  />            <chartfx7:SeriesAttributes Text="Approval In Process" PointLabels-Alignment="Near"                PointLabels-LineAlignment="Far" />            <chartfx7:SeriesAttributes Text="Pending Approval" PointLabels-Alignment="Far" />            <chartfx7:SeriesAttributes Text="Open"  PointLabels-Alignment="Near" PointLabels-LineAlignment="Center" />        </Series>        <Titles>            <chartfx7:TitleDockable Text="Top least active aprovers" />        </Titles>    </chartfx7:Chart>

[serious]

Here is the screenshot with "prevent collisions" feature enabled.

Best regards, Oleg

[Frank]

I see.

Interesting. We are redesigning the auto-layout feature and this will be a nice piece of input for it.