WPF:MySQLで取得したデータをDataGridで縦に表示させたい

Question

MySQLから取り出したデータを、

    Col0      Col1      Col2      Col3
|    1    |    2    |    3    |    4    |
|    1    |    2    |    3    |    4    |

下記のように縦に表示させたいです。

Col0 |    1    |    1    | 
Col1 |    2    |    2    | 
Col2 |    3    |    3    |
Col3 |    4    |    4    | 

その後、行ヘッダーに任意のテキストの表示も追加したいです。

        text1     text2
Col0 |    1    |    1    | 
Col1 |    2    |    2    | 
Col2 |    3    |    3    |
Col3 |    4    |    4    | 

現状はこの画像のように、行にカラム名が表示されています。

DbTest.xaml.cs

public partial class DbTest : Page
    {

        public DbTest()
        {
            InitializeComponent();

            string sLogin = "login data;";
            MySqlConnection conn = new MySqlConnection(sLogin);

            try
            {
                conn.Open();
                MySqlCommand cmd = new MySqlCommand("select * from tablename where id = 2", conn);
                MySqlDataAdapter adp = new MySqlDataAdapter(cmd);
                DataSet ds = new DataSet();
                adp.Fill(ds, "LoadDataBinding");

                DataContext = ds;
            }
            catch (MySqlException ex)
            {
                MessageBox.Show(ex.ToString());
            }
            finally
            {
                conn.Close();
            }
        }
    }
}

DbTest.xaml

<Grid Height="350" Width="625" Background="#FFD1F9EE" >
        <TextBlock Height="32" HorizontalAlignment="Left" Margin="16,15,0,0" Name="textBlockHeading" Text="Test2" VerticalAlignment="Top" Width="310"  FontSize="20" FontStretch="Normal"/>
        <Grid HorizontalAlignment="Left" Height="310" VerticalAlignment="Top" Width="625">
            <DataGrid AutoGenerateColumns="False" HorizontalAlignment="Left" Margin="14,55,0,46" Name="dataGridCustomers" Width="575" ItemsSource="{Binding Path=LoadDataBinding}" CanUserResizeRows="False">
                <DataGrid.Columns>
                    <DataGridTextColumn Binding="{Binding Path=id}" Header="id" Width="100" IsReadOnly="True" />
                    <DataGridTextColumn Binding="{Binding Path=data}" Header="data" Width="100" IsReadOnly="True" />
                </DataGrid.Columns>
                <DataGrid.RowHeaderTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding RelativeSource={RelativeSource Mode=FindAncestor, 
                                      AncestorType={x:Type DataGridRow}}, 
                                      Path=Item.Header}"/>
                    </DataTemplate>
                </DataGrid.RowHeaderTemplate>
            </DataGrid>
        </Grid>
    </Grid>

ここまではこちらのリンク先の情報を参考にしました。
https://stackoverflow.com/questions/4791929/wpf-datagrid-rowheader-databinding

(データバインドして列ヘッダーにテキストを表示させるようですが、ListやArrayにして渡しても、列ヘッダーに表示されず・・・)

・MySQLから取り出した情報をDataGridで縦に表示させる方法
・その後、行ヘッダーにテキストを表示させる方法

こちらについて、アドバイスいただければと思います。
宜しくお願い致します。

Comments

[Zuishin]

DataTable をもう一つ作って、取り出したものをそれにセットするのが簡単だと思います。

Answer 1

columnNameに行ヘッダーに設定したい文字列を格納してDataTableに追加していきました。

MySqlCommand cmd = new MySqlCommand("select * from table, connection);
MySqlDataReader rdr = cmd.ExecuteReader();

string[] columnName = new string[2] { "id", "value" }

var table = new DataTable();
table.Columns.Add("列ヘッダー1");
table.Columns.Add("列ヘッダー2");

while (rdr.Read())
{
    for (int i = 0; i < 2; i++)
    {
        var row = table.NewRow();
        row[0] = columnName[i];
        row[1] = rdr[i];
        table.Rows.Add(row);
    }
}

Answer 2

「そもそも横縦を切り替えた状態でデータを取得するSQLを作る」のが最も近道ではないでしょうか。
MySQLでテーブル構造の縦横を変換する
SQL で縦横変換まとめ（pivot と unpivot）
teratail:MySQLでカラムの縦横を入れ替えて表示したい
teratail;SQLで縦横変換して取得する方法を教えてください。