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
980
Chart legend items cut off
posted

Hi,

 

I am using XamWebChart, but for some reason the text in the legend is cut off;

These are my settings:

<Style x:Key="Style_IGChartLegend" TargetType="igChart:Legend">
        <Setter Property="Background" Value="#00000000" />
        <Setter Property="BorderBrush" Value="#FFeaeaea" />
        <Setter Property="BorderThickness" Value="0" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="igChart:Legend">
                    <Border
                             Padding="5,5,5,5"
                             Background="{TemplateBinding Background}"
                             BorderBrush="{TemplateBinding BorderBrush}"
                             BorderThickness="{TemplateBinding BorderThickness}"
                            >
                        <Canvas x:Name="RootElement" />
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

 <Style x:Key="Style_IGChartLegendItem" TargetType="igChart:LegendItem">
        <Setter Property="Foreground" Value="#FF000000" />
        <Setter Property="Stroke" Value="#00FFFFFF" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="igChart:LegendItem">
                    <Grid x:Name="RootElement">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>
                        <Rectangle
                                RadiusX="0"
                                RadiusY="0"
                                x:Name="LegendItemIcon"
                                Grid.Column="0"
                                Width="15"
                                Height="15"
                                Fill="{TemplateBinding Fill}"
                                Stroke="{TemplateBinding Stroke}"
                                StrokeThickness="0" />
                        <TextBlock
                                x:Name="LegendItemText"
                                Margin="5,0,0,0"
                                Height="Auto"  FontSize="8" HorizontalAlignment="Left"
                                Grid.Column="1"
                                Text="{TemplateBinding Text}"
                                Foreground="{TemplateBinding Foreground}"
                                ToolTipService.ToolTip="{TemplateBinding Text}"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Stroke" Value="#00FFFFFF" />
    </Style>

 

 

<igChart:XamWebChart x:Name="chart" EndPaletteBrush="#FFDEC51E" VerticalContentAlignment="Top" Width="800" HorizontalContentAlignment="Left">
                <igChart:XamWebChart.Legend>
                    <igChart:Legend
                         Visibility="Visible"
                         VerticalAlignment="Top"
                        LegendItemStyle="{StaticResource Style_IGChartLegendItem}"
                        Style="{StaticResource Style_IGChartLegend}"    
                        Height="150"
                         Margin="5,0,0,0" /> <!---->
                </igChart:XamWebChart.Legend>

                <igChart:XamWebChart.Series>
                    <igChart:Series ChartType="Pie" Label="TestSeriesLabel"
                                  DataSource="{Binding}"
                                    DataMapping="Label=Label;Value=Value;ToolTip = ToolTip"/>
                </igChart:XamWebChart.Series>

            </igChart:XamWebChart>

 

 

The user control which is parent of the chart has Auto dimensions...

 

Thanks

Parents
No Data
Reply
  • 5
    posted

    Hi,

     

    We are also having the same problem with the text getting cut off. It would be nice if the Width property can be made as wide as needed to accommodate longer labels

Children
No Data