DOBON.NET DOBON.NETプログラミング掲示板過去ログ

tableコントールのセル内にtableを作りたい

環境/言語:[WindowsXP/VB.NET]
分類:[ASP.NET]

お世話になります。

tableコントロールを使用して下記表形式の横棒グラフを作成しており、行き詰まりましたので質問させてください。

・文字列部分は3つのセルを結合して作成。
・上下に余白(白)がある棒グラフを作成する。(3行用意して作成する真ん中がグラフ)

と作成してみたものの、グラフ部分は3行使用しており、グラフ部分の縦線は残したいが、横線は消したいと云う事が出来ませんでした。
###つまりグラフ部分は1つのセルと見せたいが、上下の余白を付けたいと云う事です。

tableコントロールのセル内にtableコントロールを作成すると云う事も考えたのですが、上手く出来ずに困っております。
.aspxに<asp:TableCell></asp:TableCell>内に<table>を作成しても上手くいきません。
尚、ヘッダー以外の行は全て動的に作成しております。

作成したい表
------------------------------------------------------------------
|文字列    |(白枠)                    |　|　|　|　|　|　|　|　|　|
|(セル結合)|グラフ部分(セルの色を塗る)|■|■|■|■|　|■|■|■|■|
|          |(白枠)                    |　|　|　|　|　|　|　|　|　|
------------------------------------------------------------------

以上宜しく御願い致します。
サンプルを書いてみました。苦しいコードではありますが、参考になれば幸いです。
＃　もし外れていたらすみません。m(_ _)m

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="BarGraphTest.aspx.vb" Inherits="BarGraphTest" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>無題のページ</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:Table ID="Table1" runat="server">
    </asp:Table>
    <br />
    </div>
    </form>
</body>
</html>


Partial Class BarGraphTest
    Inherits System.Web.UI.Page

    Protected Overrides Sub OnLoad(ByVal e As System.EventArgs)
        MyBase.OnLoad(e)
        ' 表にセルを追加
        With Me.Table1
            .BorderStyle = BorderStyle.Solid
            .CellSpacing = 0
            .BorderWidth = 2
            .BorderColor = Drawing.Color.Blue
        End With
        For i As Integer = 1 To 15
            Dim tr As New TableRow
            For j As Integer = 0 To 10
                Dim tc As New TableCell
                If j = 0 Then tc.Width = 100 Else tc.Width = 40
                tc.Height = 20
                tc.BorderWidth = 1
                tc.BorderColor = Drawing.Color.Black
                tr.Cells.Add(tc)
            Next
            Me.Table1.Rows.Add(tr)
        Next
        ' 各行の文字列と棒グラフの長さ
        Dim captions As String() = {"項目１", "項目２", "項目３", "項目４", "項目５"}
        Dim values As Integer() = {3, 0, 7, 10, 5}
        ' RowSpanを３にする
        For i As Integer = 0 To 4
            Me.Table1.Rows(i * 3).Cells(0).Text = captions(i)
            Me.Table1.Rows(i * 3).Cells(0).RowSpan = 3
            Me.Table1.Rows(i * 3 + 1).Cells(0).Visible = False
            Me.Table1.Rows(i * 3 + 2).Cells(0).Visible = False
        Next
        ' 棒グラフ描画
        For i As Integer = 0 To 4
            For j As Integer = 1 To 10
                Dim tc1 As TableCell = Me.Table1.Rows(i * 3).Cells(j)
                Dim tc2 As TableCell = Me.Table1.Rows(i * 3 + 1).Cells(j)
                Dim tc3 As TableCell = Me.Table1.Rows(i * 3 + 2).Cells(j)
                tc1.Style.Add("border-bottom-style", "none")
                tc2.Style.Add("border-top-style", "none")
                tc2.Style.Add("border-bottom-style", "none")
                tc3.Style.Add("border-top-style", "none")
                If j <= values(i) Then
                    tc2.BackColor = Drawing.Color.Red
                Else
                    tc2.BackColor = Drawing.Color.White
                End If
            Next
        Next
    End Sub
End Class
サンプルコード有難う御座います！
正にこれがやりたかったのです。

最初上下の線を消す事をやりたかったのですが、方法が分からなかったので、周りに聞いたらtableを2重で作成出来ると聞き質問させて頂きました。

"border-style"が個々に出来るのは調査不足でした。

本当に有難う御座いました。
解決済み!
DOBON.NET | プログラミング道 | プログラミング掲示板