CompositeChart for ASP.NET Web forms
系列のデフォルト色の変更
タスク別ヘルプ > 系列のデフォルト色の変更

PieChartSeriesに系列スタイルを適用すると、最初のスタイルが中央上のスライスに適用され、さらに反時計回りに適用されます。スタイルは、最初の円グラフの最初の系列に適用されてから、さらに各系列に反時計回りに適用されます。最初の円グラフに系列スタイルが適用されると、さらに次の円に系列スタイルが追加されます。特定の系列にスタイルを適用する場合は、すべての系列にスタイルを追加する必要があります。各スタイルは特定の系列を表します。たとえば、次の図では、PieChartの各系列に系列スタイルのラベルが付いています。これらのラベルは、最初の円グラフを表す系列を示します。

 

デザインビューでの系列のデフォルト色の変更

デザインビューでコンポジットチャートのPieChartSeriesを変更するには

  1. C1CompositeChartのスマートタグをクリックして、[C1CompositeChartのタスク]メニューを開き、SeriesStylesを選択します。ChartStyleコレクションエディタが表示されます。
  2. ChartStyleコレクションエディタで、[追加]ボタンを14回クリックして、14のスタイルを追加し、内側の円のデフォルトの系列スタイルが外側の円の系列スタイルと一致するように変更します。
  3. スタイルメンバごとに、Fillノードを展開し、Colorプロパティの横に目的の色を入力します。
  4. 終了したら[OK]をクリックします。

ソースビューでの系列のデフォルト色の変更

以下のコードを使用して、C1Compositeチャート内の円グラフのデフォルト色を変更します。

ソースビュー
コードのコピー
<cc1:C1CompositeChart ID="C1CompositeChart1" runat="server" Height="475px"
        Width="750px">
        <SeriesList>
            <cc1:CompositeChartSeries Center="400, 250" LegendEntry="True" Type="Pie"
                Radius="100">
                <PieSeriesList>
                    <cc1:PieChartSeries Data="38" HintContent="" Label="Chrome"
                        LegendEntry="True">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="36" HintContent="" Label="FireFox"
                        LegendEntry="True">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="13" HintContent="" Label="IE" LegendEntry="True">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="8" HintContent="" Label="Safari" LegendEntry="True">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="5" HintContent="" Label="Other" LegendEntry="True">
                    </cc1:PieChartSeries>
                </PieSeriesList>
            </cc1:CompositeChartSeries>
            <cc1:CompositeChartSeries Center="400, 250" LegendEntry="True"
                Type="Pie">
                <PieSeriesList>
                    <cc1:PieChartSeries Data="26" HintContent="" Label="15" LegendEntry="False">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="8" HintContent="" Label="14" LegendEntry="False">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="4" HintContent="" LegendEntry="False" Label="4">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="20" HintContent="" Label="7" LegendEntry="False">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="10" HintContent="" Label="8" LegendEntry="False">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="6" HintContent="" Label="6" LegendEntry="False">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="6" HintContent="" Label="9" LegendEntry="False">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="5" HintContent="" Label="8" LegendEntry="False">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries HintContent="" Label="2" LegendEntry="False" Data="2">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="5" HintContent="" Label="5" LegendEntry="False">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="3" HintContent="" Label="3" LegendEntry="False">
                    </cc1:PieChartSeries>
                    <cc1:PieChartSeries Data="5" HintContent="" LegendEntry="False" Label="5">
                    </cc1:PieChartSeries>
                </PieSeriesList>
            </cc1:CompositeChartSeries>
        </SeriesList>
        <SeriesStyles>
            <cc1:ChartStyle>
                <Fill Color="#00CC00">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle Stroke="#FF9966">
                <Fill Color="#FF9966">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle Stroke="#CCCCFF">
                <Fill Color="#CCCCFF">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle Stroke="#0099CC">
                <Fill Color="#0099CC">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle Stroke="#9933FF">
                <Fill Color="#9933FF">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle FillOpacity="0.6">
                <Fill Color="#00CC00">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle Stroke="#00CC00">
                <Fill Color="#00CC00">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle FillOpacity="0.5" Stroke="#00CC00">
                <Fill Color="#00CC00">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle FillOpacity="0.5" Stroke="#FF9966">
                <Fill Color="#FF9966">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle FillOpacity="0.5" Stroke="#FF9966">
                <Fill Color="#FF9966">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle Stroke="#FF9966">
                <Fill Color="#FF9966">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle Stroke="#CCCCFF">
                <Fill Color="#CCCCFF">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle Stroke="#CCCCFF">
                <Fill Color="#CCCCFF">
                </Fill>
            </cc1:ChartStyle>
            <cc1:ChartStyle>
                <Fill Color="#CCCCFF">
                </Fill>
            </cc1:ChartStyle>
        </SeriesStyles>
  <Header Compass="North"></Header>
  <Footer Compass="South" Visible="False"></Footer>

  <Axis>
   <X AutoMajor="False" AutoMin="False">
      <GridMajor Visible="True"></GridMajor>
      <GridMinor Visible="False"></GridMinor>
   </X>

   <Y Visible="False" Compass="West" AutoMajor="False" AutoMin="False">
      <Labels TextAlign="Center"></Labels>
      <GridMajor Visible="True"></GridMajor>
      <GridMinor Visible="False"></GridMinor>
   </Y>
  </Axis>
</cc1:C1CompositeChart>