Chartで折れ線と100%積上げグラフを作成しているのですが積上げグラフが上手く表示出来ません

### 前提・実現したいこと
VB2010 Windows7環境
Chartで折れ線と100%積上げグラフを表示したい。

発生している問題

積上げグラフが棒グラフにしかならない

該当のソースコード

CharTはForMに張り付けている

VB2010
1
2#Region "GRAPH 初期化"
3
4    Private Sub ChartClar(ByVal cht As Chart)
5        'Chart の設定を初期値に戻す(通常は必要ありません)
6        With cht
7            .Titles.Clear()                  'タイトルの初期化
8            .BackGradientStyle = GradientStyle.None
9            .BackColor = Color.White         '背景色を白色に
10            '外形をデフォルトに
11            .BorderSkin.SkinStyle = BorderSkinStyle.None
12            .Legends.Clear()                 '凡例の初期化
13            .Legends.Add("Legend1")
14            .Series.Clear()                  '系列(データ関係)の初期化
15            .ChartAreas.Clear()              '軸メモリ・3D 表示関係の初期化
16            .ChartAreas.Add("ChartArea1")
17            .Annotations.Clear()
18        End With
19    End Sub
20
21#End Region
22
23#Region "GRAPH 印刷 (営業所別)"
24
25    Private Sub Chart_Display_EIGYO()
26
27        Chart1.DataSource = ds                       'Chart に表示するデータソースを設定
28        colums = ds.Tables(0).Columns.Count - 1      'データの系列数を取得
29
30        Call ChartClar(Chart1)  '設定を一旦初期値に戻す。(通常は必要ありません。)
31
32        With Chart1
33            'For i As Integer = 1 To colums
34            For i As Integer = 1 To 7
35                Dim columnName As String = ds.Tables(0).Columns(i).ColumnName.ToString()
36                .Series.Add(columnName)
37                .Series(columnName).ChartType = DataVisualization.Charting.SeriesChartType.Column
38                .Series(columnName).XValueMember = ds.Tables(0).Columns(0).ColumnName.ToString()
39                .Series(columnName).YValueMembers = columnName
40            Next
41```ここに言語を入力 StackedColumn100
42を追加
43
44            For i As Integer = 7 To 11
45 
46                Dim columnName As String = ds.Tables(0).Columns(i).ColumnName.ToString()
47                .Series.Add(columnName)
48                .Series(columnName).ChartType = DataVisualization.Charting.SeriesChartType.StackedColumn100
49               .Series(columnName).XValueMember = ds.Tables(0).Columns(0).ColumnName.ToString()
50              .Series(columnName).YValueMembers = columnName
51            Next
52

'------------- ここまでは、基本的な表示設定と同じ -----------------------------------------
With Chart1
.Series(0).YAxisType = AxisType.Primary
'Series(0) のグラフを折れ線に設定
.Series(0).ChartType = SeriesChartType.Line
.Series(0).Color = Color.Black
.Series(0).BorderWidth = 2
.Series(0).MarkerStyle = MarkerStyle.Star5
.Series(0).MarkerSize = 8
.Series(0).MarkerColor = Color.Black
'■文字制限の為Series(1)～Series(5)を割愛

        End With

        '■-----------------------------------------------------------------End----■


        '■------------------------ Y軸 に関する設定 -------------------------Start--■

        With Chart1.ChartAreas(0).AxisY
            .LabelStyle.Format = "#,##0"  '桁区切りで表示の場合
            .LabelAutoFitMaxFontSize = 11
        End With
        '■-------------------------------------------------------------------End----■

        '■------------------------- 第二Y軸関係の設定 ---------------------Start--■
        With Chart1
            '■
            'Series(5) をY軸で表示
            .Series(6).YAxisType = AxisType.Secondary
            .Series(6)("DrawingStyle") = "Cylinder"
            .Series(6).Color = Color.Red
            .Series(6)("PointWidth") = "0.5"
            '第二Y軸の目盛り関係の設定
            With .ChartAreas(0).AxisY2
                '.Maximum = 8000      '点数の最大値
                '.Minimum = 0         '点数の最小値
                '.Interval = 1000     '点数のメモリ間隔
                .LineDashStyle = DataVisualization.Charting.ChartDashStyle.Solid
                '.LabelAutoFitMaxFontSize = 10
                '.LabelAutoFitMinFontSize = 8
                .LabelStyle.ForeColor = Color.Red
                .LineColor = Color.Red ' Color.LightGreen
                .LineWidth = 2
                .LabelStyle.Format = "#,###"  '桁区切りで表示の場合
                .MajorGrid.LineColor = Color.Red
                .MajorGrid.LineDashStyle = DataVisualization.Charting.ChartDashStyle.Dash
            End With
        End With
        '■-----------------------------------------------------------------End----■
        GoTo AA
        Dim series() As Series = New Series(6) {}
        series(0) = Chart1.Series(0)
        series(1) = Chart1.Series(1)
        series(2) = Chart1.Series(2)
        series(3) = Chart1.Series(3)
        series(4) = Chart1.Series(4)
        series(5) = Chart1.Series(5)

        Chart1.Series.Clear()

        Chart1.Series.Add(series(5))
        Chart1.Series.Add(series(0))
        Chart1.Series.Add(series(1))
        Chart1.Series.Add(series(2))
        Chart1.Series.Add(series(3))
        Chart1.Series.Add(series(4))

AA:
'■------------------------ X軸に関する設定 -------------------------Start--■
With Chart1.ChartAreas(0).AxisX

            .IsLabelAutoFit = True  '下記設定は、(True 既定値)に設定しておかないと有効とならない。
            .LabelAutoFitStyle = LabelAutoFitStyles.DecreaseFont Or LabelAutoFitStyles.IncreaseFont
            .LabelAutoFitMaxFontSize = 15
            .LabelAutoFitMinFontSize = 5     '5 以下の設定はできない

            .MajorGrid.Interval = 0    ' 1 に変更して試して見てください。 
            .MajorGrid.IntervalOffset = 0.5  '列と列の間に表示される

            .LabelStyle.Interval = 1    '１データ毎に表示(すべて表示)

            .LineColor = Color.Red
            .LineWidth = 2

        End With
        '■-------------------------------------------------------------------End----■
        '■------------------- データポイントラベルの設定・表示 ----------------Start--■
        For i As Integer = 0 To .Series.Count - 1
            With .Series(i)
                'データラベルにデータポイントの Y 値を表示
                .Label = "#VALY{#,##0}"  'マクロ(キーワード)で指定　注①　参照
                If i = 0 Then .LabelForeColor = Color.DarkViolet '**
                If i = 1 Then .LabelForeColor = Color.Black '**
                If i = 2 Then .LabelForeColor = Color.Green '**
                If i = 3 Then .LabelForeColor = Color.Brown '**
                If i = 4 Then .LabelForeColor = Color.Blue '**
                If i = 5 Then .LabelForeColor = Color.Red '** 
                .Font = New Font("", 11)
                '.Font = New Font("ＭＳ Ｐ明朝", 10, FontStyle.Bold)
            End With
        Next
        '■---------------------------------------------------------------------End----■


        '☆★☆★☆★☆★☆★☆★☆★☆★ ここからは、グラフの装飾の部分です ☆★☆★☆★☆★☆★☆★☆★☆★

        '■------------------- 凡例の設定 ----------------Start--■
        'If btnTAN.Checked = True Then
        '.Series(0).LegendText = "当月粗利"             '独自の凡例を設定する
        'Else

        .Series(0).LegendText = "合計"               '独自の凡例を設定する
        .Series(1).LegendText = "本　社"             '独自の凡例を設定する
        .Series(2).LegendText = "北海道"             '独自の凡例を設定する
        .Series(3).LegendText = "東　北"             '独自の凡例を設定する
        .Series(4).LegendText = "関　東"             '独自の凡例を設定する
        .Series(5).LegendText = "九　州"             '独自の凡例を設定する

        .Legends(0).Alignment = StringAlignment.Center     '凡例の縦方向の表示位置
        .Legends(0).BorderColor = Color.Red                '凡例の枠の線の色
        .Legends(0).BackColor = Color.Yellow               '凡例のバックカラー
        .Legends(0).Docking = Docking.Bottom               '凡例の横方向の表示位置
        .Legends(0).ShadowOffset = 4                       '枠に影を付けて立体的に表示
        '■-------------------------------------------------End----■
        '■------------------- 棒のカラーを指定の色に設定 ----------------Start--■
        '■------------------- タイトルを設定 ----------------Start--■
        Chart1.Titles.Add("")
        With Chart1.Titles(0)
            .Alignment = Drawing.ContentAlignment.TopCenter
            .ForeColor = Color.Red
            .Font = New Font("", 12)
            .Text = Page_Title
        End With

        Chart1.Titles.Add("")
        With Chart1.Titles(1)
            .Alignment = Drawing.ContentAlignment.MiddleLeft
            '.Font = New Font("ＭＳ Ｐ明朝", 10)
            .Font = New Font("", 12)
        End With
        '■----------------------------------------------------End----■

    End With

End Sub

#End Region

退会済みユーザー

2018/09/25 00:56

タグを VB.NET に修正してください。Windows Forms アプリの Chart コントロールの話ですよね?

行動規範の内容に同意します

回答1件

アップされたコードはほとんど読んでないのでハズレかもしれませんが・・・

積上げグラフが上手く表示出来ません

Series.ChartType プロパティを SeriesChartType.StackedColumn に設定する必要があるはずです。

【追伸】

以前作ったサンプルをアップしておきます。

このようなグラフなら、

以下のコードでできます。

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
using System.Data.SqlClient;
using System.Windows.Forms.DataVisualization.Charting;

namespace WindowsFormsChart
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private DataTable CreateDataTable()
        {
            string connString = @"Data Source=(local)\sqlexpress;Initial Catalog=Database;Integrated Security=True";
            string selectQuery = 
                @"SELECT 
                    Month, 
                    SUM(CASE WHEN Name = N'三吉' THEN Sales ELSE 0 END) AS 三吉, 
                    SUM(CASE WHEN Name = N'春日' THEN Sales ELSE 0 END) AS 春日, 
                    SUM(CASE WHEN Name = N'東雲' THEN Sales ELSE 0 END) AS 東雲, 
                    SUM(CASE WHEN Name = N'府中' THEN Sales ELSE 0 END) AS 府中, 
                    SUM(CASE WHEN Name = N'広島' THEN Sales ELSE 0 END) AS 広島 
                    FROM Shop GROUP BY Month";
            using (SqlConnection connection = new SqlConnection(connString))
            {
                SqlDataAdapter adapter = new SqlDataAdapter();
                adapter.SelectCommand = new SqlCommand(selectQuery, connection);
                DataTable table = new DataTable();
                adapter.Fill(table);
                return table;
            }
        }

        private void Form1_Load(object sender, EventArgs e)
        {
            Chart chart = new Chart()
            {
                Name = "chart1",
                Width = 600,
                DataSource = CreateDataTable()                
            };

            this.Controls.Add(chart);

            Legend legend = new Legend()
            {
                DockedToChartArea = "ChartArea1",
                IsDockedInsideChartArea = false,
                Name = "Legend1"
            };
            chart.Legends.Add(legend);

            Series series = new Series()
            {
                Name = "三吉",
                ChartType = SeriesChartType.StackedColumn,
                CustomProperties = "DrawingStyle=Cylinder",
                IsValueShownAsLabel = true,
                Label = "#PERCENT{P1}",
                Legend = "Legend1",
                XValueMember = "Month",
                YValueMembers = "三吉"
            };
            chart.Series.Add(series);

            series = new Series()
            {
                Name = "春日",
                ChartType = SeriesChartType.StackedColumn,
                CustomProperties = "DrawingStyle=Cylinder",
                IsValueShownAsLabel = true,
                Label = "#PERCENT{P1}",
                Legend = "Legend1",
                XValueMember = "Month",
                YValueMembers = "春日"
            };
            chart.Series.Add(series);

            series = new Series()
            {
                Name = "東雲",
                ChartType = SeriesChartType.StackedColumn,
                CustomProperties = "DrawingStyle=Cylinder",
                IsValueShownAsLabel = true,
                Label = "#PERCENT{P1}",
                Legend = "Legend1",
                XValueMember = "Month",
                YValueMembers = "東雲"
            };
            chart.Series.Add(series);

            series = new Series()
            {
                Name = "府中",
                ChartType = SeriesChartType.StackedColumn,
                CustomProperties = "DrawingStyle=Cylinder",
                IsValueShownAsLabel = true,
                Label = "#PERCENT{P1}",
                Legend = "Legend1",
                XValueMember = "Month",
                YValueMembers = "府中"
            };
            chart.Series.Add(series);

            series = new Series()
            {
                Name = "広島",
                ChartType = SeriesChartType.StackedColumn,
                CustomProperties = "DrawingStyle=Cylinder",
                IsValueShownAsLabel = true,
                Label = "#PERCENT{P1}",
                Legend = "Legend1",
                XValueMember = "Month",
                YValueMembers = "広島"
            };
            chart.Series.Add(series);

            ChartArea chartArea = new ChartArea()
            {
                Name = "ChartArea1",
                AxisY = new Axis() { Title = "売上高" },
                AxisX = new Axis() { Title = "売上月" }
            };
            chart.ChartAreas.Add(chartArea);            
        }
    }
}

Chart のサンプルは持っているでしょうか？

持っていなければ MSDN のサイトからサンプルを入手できるので、ダウンロードして動くように設定することをお勧めします。

解説が英語であるのを厭わなければこのサンプルは今後の開発に非常に有益なものになると思います。

このスレッドの質問者さんの問題がサンプルを見ると解決するかどうかは分かりませんが、解決のためのヒントはあるかもしれません。例えば下記：

解決できなくとも、今後の開発に役立つはずですので、ダウンロードして設定する手間をかけても損はないと思います。

サンプルの入手先や設定手順は以下の記事にありますので、興味があれば見てください。

Chart Samples
http://surferonwww.info/BlogEngine/post/2016/02/14/chart-samples.aspx

投稿2018/09/25 01:27

編集2018/09/25 01:41

退会済みユーザー

総合スコア0

tamachan2020

2018/09/25 01:54

PNG画像を挿入したのですが表示されないようです。折れ線グラフのみ、100%積上げグラフはサンプルが有りそれぞれ表示されるのですが､一つのグラフに両方表示しようとしているのですが､上手くいきません。現在､のコーディングでは折れ線グラフと棒グラフは表示されるのですが､棒グラフが100%積み上げにならないのです。

退会済みユーザー

2018/09/25 02:17

回答に、 > Series.ChartType プロパティを SeriesChartType.StackedColumn に設定する必要があるはずです。と書きましたが、そこのところはどうなってますか？

tamachan2020

2018/09/25 02:46

StackedColumn100を追加すると棒グラフも消えてしまうのです。 EXECELだと折れ線ｸﾞﾗﾌと積み上げも可能なようですがVB上では無理なのか ?

退会済みユーザー

2018/09/25 06:37 編集

Line と StackedColumn100 を同じ ChartArea 内に重ねて表示するというのは、自分が調べた限りですが、無理っぽいです。 Chart の中に 2 つの ChartArea を上下並べて配置して片方に Line、他方に StackedColumn100 なら問題なくできると思いますが。

tamachan2020

2018/09/25 06:57

有難うございます。 1) 折れ線グラフをベースに積上げグラフの追加 2) 積上げグラフをベースに折れ線グラフの追加 1),2)を試したのですが上手くいかないので断念します。

行動規範の内容に同意します