[ASP.net] 關於ASP.net Chart- Column圖改變 Points 上標 Label 文字樣式

贊助區

itCoin:

3ExcHdua3crim67XdnGhTVMq6hTRawgkCu

Ethereum:

0xb1f6c1880c058a4b7d1ee06d325411c1c1de3573

Crypto.com(虛擬貨幣入門選擇，用我連結註冊馬上送 $25美金)

派網 (網格交易第一選擇，新手必推)

幣安 Binance (第一名交易所，點擊註冊，送獎勵)

ByBit (體驗最好的交易所，點擊註冊送獎勵)

幣託 BitoPro (台灣虛擬貨幣換成台幣必備，點擊註冊) :

數字貨幣貪婪恐慌指數

2013-06-26

上一篇說到關於Radar 圖的一些有的沒的，這一篇分享一下碰到Column Chart 上面老闆的要求

首先一樣先拉入一張Chart 並且設定為Column圖

設定一些Series 其中我建立的範例LegendText 為能力、智力、速度三種

其中的Label 為 #VAL

看一下ASPX Code :

<asp:Chart ID="Chart1" runat="server">

    <Legends>

    <asp:Legend Alignment="Center" Docking="Bottom" Name="Legend1">

    </asp:Legend>

</Legends>

    <Series>

        <asp:Series Name="Series1" LegendText="能力" Label="#VAL"></asp:Series>

        <asp:Series ChartArea="ChartArea1" LegendText="智力" Name="Series2"  Label="#VAL">

        </asp:Series>

        <asp:Series ChartArea="ChartArea1" LegendText="速度" Name="Series3"  Label="#VAL">

        </asp:Series>

    </Series>

    <ChartAreas>

        <asp:ChartArea Name="ChartArea1"></asp:ChartArea>

    </ChartAreas>

</asp:Chart>

再來就是C# Code 這邊匯入資料

C#:

DataTable dt = new DataTable();

dt.Columns.Add("英雄名稱");

dt.Columns.Add("能力");

dt.Columns.Add("智力");

dt.Columns.Add("速度");

Chart1.Series[0].XValueMember = "英雄名稱";

Chart1.Series[0].YValueMembers = "能力";

Chart1.Series[1].YValueMembers = "智力";

Chart1.Series[2].YValueMembers = "速度";

dt.Rows.Add(new object[] { "浩克", 5, 5, 0 });

dt.Rows.Add(new object[] { "鋼鐵人", 5, 5, 2 });

dt.Rows.Add(new object[] { "美國隊長", 5, 1, 4 });

Chart1.DataSource = dt.DefaultView;

Chart1.DataBind();

這時候來看一下結果..

這時候老闆需求是因為高分的5 希望是紅色顯示其上標數字，並且 0 分的就是不要出現其上標數字

查了一下做法，因為這是必須獨立去設定每一個分數上面的上標文字

所以在 Databind 之後加上這段Code.

C#:

foreach (var series in Chart1.Series)

    foreach (var point in series.Points)

        if (point.YValues[0] == 0)

            point.Label = string.Empty;

        else if (point.YValues[0] >= 5)

            point.LabelForeColor = Color.Red;

結果:

一些很簡單的小技巧，給需要用到的人自己也筆記一下