I am working with the SFChart and I am looking to create a chart that looks like the following:
<Grid VerticalOptions="Start">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="4*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!--Chart (SyncFusion) -->
<chart:SfChart HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand"
Grid.Column="0"
Margin="0,10"
x:Name="conformChart">
<!--Trait Name Axus-->
<chart:SfChart.PrimaryAxis>
<chart:CategoryAxis ShowMajorGridLines="True"
EdgeLabelsDrawingMode="Center"
AutoScrollingMode="Start"
LabelPlacement="BetweenTicks" />
</chart:SfChart.PrimaryAxis>
<!--Trait Value Axis-->
<chart:SfChart.SecondaryAxis>
<chart:NumericalAxis Minimum="-2"
OpposedPosition="True"
Maximum="2"
Interval="1">
</chart:NumericalAxis>
</chart:SfChart.SecondaryAxis>
<chart:SfChart.Series>
<!--Bar Chart-->
<chart:BarSeries x:Name="ConformationBarChart"
ItemsSource="{Binding ChartData}"
XBindingPath="TraitName"
YBindingPath="TraitValue"
Color="{StaticResource AppColorPrimaryLight}"
EnableAnimation="True">
</chart:BarSeries>
</chart:SfChart.Series>
</chart:SfChart>
<ListView Grid.Column="1"
ItemsSource="{Binding ChartDataValuesAndDescriptors, Mode=TwoWay}"
RowHeight="35"
Margin="{Binding Converter={StaticResource ConformationListViewMarginConverter}}"
SeparatorVisibility="None"
IsEnabled="False">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid ColumnSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Label Text="{Binding TraitValue, Mode=TwoWay}"
VerticalOptions="Start"
HorizontalTextAlignment="Start"
VerticalTextAlignment="Start"
Margin="2.5,0"
FontSize="10"
FontAttributes="Bold" />
<Label Text="{Binding TraitValueText, Mode=TwoWay}"
Grid.Column="1"
FontSize="10"
Margin="2.5,0"
FontAttributes="Bold"
HorizontalTextAlignment="Start"
VerticalTextAlignment="Start"
VerticalOptions="Start" />
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>