Hi Jake,
Thank
you for reaching out to us.
We
have reviewed your query regarding adding space between the Doughnut chart and
the inner center view. To create the desired spacing, we recommend setting the
WidthRequest property for the center view. To determine the appropriate width,
we used the DoughnutSizeConverter with a 75% value based on the InnerRadius
property. The InnerRadius property provides the radius of the center
view.
For your reference, we have attached a code snippet and a sample with these
modifications. Kindly review them and let us know if this resolves your
query.
Note: You can adjust the percentage value as per your requirements for setting
space between them.
Code:
|
<ContentPage.Resources>
<ResourceDictionary>
<chart:DoughnutSizeConverter x:Key="DoughnutSizeConverter" Percentage="75"/>
</ResourceDictionary>
</ContentPage.Resources>
<Grid>
<chart:SfChart>
<chart:SfChart.Series>
<chart:DoughnutSeries ItemsSource="{Binding Data}"
x:Name="doughnutChart"
CircularCoefficient="1"
DoughnutCoefficient="0.4"
XBindingPath="Category"
YBindingPath="Value">
<chart:DoughnutSeries.CenterView>
<StackLayout HorizontalOptions="FillAndExpand"
BackgroundColor="LightBlue"
WidthRequest="{Binding InnerRadius, Converter={StaticResource DoughnutSizeConverter}}">
<!--
Your content here -->
<Label Text="27,346.78" FontSize="20"
FontAttributes="Bold"
MaxLines="1"
HorizontalOptions="Center"/>
<Label Text="Hours" HorizontalOptions="Center"
/>
</StackLayout>
</chart:DoughnutSeries.CenterView>
</chart:DoughnutSeries>
</chart:SfChart.Series>
</chart:SfChart>
</Grid>
|
Regards,
Kamalesh P
Attachment:
DoughnutSample_c9eaa598.zip
