Как установить цвета серии диаграмм в MVC 3?

Ответ 1

Вам нужно создать ChartTheme, если вы хотите настроить диаграмму. К несчастью, они выглядят немного взломанными...

Eg. попробуйте задать тему следующим образом:

var myChart = new Chart(width: 600, height: 400, theme: ChartTheme.Green)

Вы заметите, что ваш график выглядит по-другому. Если вы нажмете на ChartTheme.Green и нажмите F12 (Go To Definition), вы увидите, что класс ChartTheme заполнен огромными строками, определяющими, как выглядят диаграммы:

public const string Blue = @"<Chart BackColor=""#D3DFF0"" BackGradientStyle=""TopBottom"" BackSecondaryColor=""White"" BorderColor=""26, 59, 105"" BorderlineDashStyle=""Solid"" BorderWidth=""2"" Palette=""BrightPastel"">
    <ChartAreas>
        <ChartArea Name=""Default"" _Template_=""All"" BackColor=""64, 165, 191, 228"" BackGradientStyle=""TopBottom"" BackSecondaryColor=""White"" BorderColor=""64, 64, 64, 64"" BorderDashStyle=""Solid"" ShadowColor=""Transparent"" /> 
    </ChartAreas>
    <Legends>
        <Legend _Template_=""All"" BackColor=""Transparent"" Font=""Trebuchet MS, 8.25pt, style=Bold"" IsTextAutoFit=""False"" /> 
    </Legends>
    <BorderSkin SkinStyle=""Emboss"" /> 
  </Chart>";

В этом XML файле вы можете настроить огромное количество материалов (почему XML? Я не знаю!), хотя тип диаграммы и т.д., которые вы используете, будет влиять на многое из того, что вы можете сделать. Вы можете найти документы для этого здесь:

http://msdn.microsoft.com/en-us/library/dd456696.aspx

Изменить. Эта ссылка также может быть полезна:

Новые элементы управления настройками asp.net - будут ли они работать с MVC (в конечном итоге)?

Ответ 2

В этой статье в блоге описывается, как изменить цвета вашей серии Настройка цветов диаграмм серии Microsoft

Если вы хотите использовать формат XML вместо этого, скопируйте следующий код, где я изменил цвет на красный.

    public class CustomChartTheme
{
    public const string Red = @"<Chart BackColor=""#58A5CB"" BackGradientStyle=""TopBottom"" BackSecondaryColor=""White"" BorderColor=""26, 59, 105"" BorderlineDashStyle=""Solid"" BorderWidth=""2"" Palette=""None"" PaletteCustomColors=""Red"">
<ChartAreas>
    <ChartArea Name=""Default"" _Template_=""All"" BackColor=""64, 165, 191, 228"" BackGradientStyle=""TopBottom"" BackSecondaryColor=""White"" BorderColor=""64, 64, 64, 64"" BorderDashStyle=""Solid"" ShadowColor=""Transparent"" /> 
</ChartAreas>
<Legends>
    <Legend _Template_=""All"" BackColor=""Transparent"" Font=""Trebuchet MS, 8.25pt, style=Bold"" IsTextAutoFit=""False"" /> 
</Legends>
<BorderSkin SkinStyle=""Emboss"" />   </Chart>";
}

Ответ 3

Для проектов MVC мне легче настраивать внешний вид диаграммы, помещая тему во внешний XML файл. Например. вы можете поместить XML файл в свою папку Content и затем ссылаться на него в конструкторе Chart следующим образом:

var myChart = new Chart(width: 600, height: 200, themePath: "/Content/chart/ChartTheme.xml")

Затем вы можете создавать все аспекты, включая цветовую палитру в XML. Структура XML отражает различные классы и свойства, используемые в экземпляре диаграммы. Для руководства вы можете проверить документацию MSDN для классов, начиная с here.

Для изменения ColorPallette специально проверьте https://crmchartguy.wordpress.com/2012/08/23/palette-custom-colors-in-charts/

Это пример диаграммы в XML:

<?xml version="1.0" encoding="utf-8" ?> 
<Chart BackColor="#ffffff" 
   BorderStyle="None"
   Palette="None"
   PaletteCustomColors="#0033cc; #ff3300">
  <ChartAreas>    
    <ChartArea Name="Default" _Template_="All" 
           BackColor="White" 
           ShadowColor="#aaaaaa"
           ShadowOffset="2"
           BorderColor="#cccccc" 
           BorderDashStyle="Solid"  
           Position="-1,0,100,75">      
      <AxisY LineColor="#cccccc" IsLabelAutoFit="false" IsMarginVisible="true">        
        <MajorGrid Interval="Auto" LineColor="#cccccc" />   
        <MajorTickMark LineColor="#aaaaaa" LineWidth="1" LineDashStyle="Solid" /> 
        <LabelStyle Font="Helvetica Neue, 10 px" />      
      </AxisY>      
      <AxisX LineColor="#cccccc" IsLabelAutoFit="false" IsMarginVisible="true">        
        <MajorGrid LineColor="#cccccc" /> 
        <MajorTickMark LineColor="#666666" />   
        <LabelStyle Font="Helvetica Neue, 10 px" Format="d-M-yyyy"/>      
      </AxisX>     
     </ChartArea>  
    </ChartAreas>  
    <Legends>    
      <Legend _Template_="All" 
        Alignment="Center" 
        BackColor="Transparent" 
        Docking="Bottom" 
        Font="Helvetica Neue, 12 px" 
        IsTextAutoFit ="False" 
        LegendStyle="Row">   
    </Legend>  
  </Legends> 
</Chart>

Ответ 4

Я тоже борюсь с этим, и, прочитав документацию Microsoft, опубликованную Дэнни, я наконец обнаружил, что атрибут PaletteCustomColor - это путь. Вот пример темы с пользовательской палитрой:

const string blue = @"<Chart BackColor=""#D3DFF0"" BackGradientStyle=""TopBottom"" BackSecondaryColor=""White"" BorderColor=""26, 59, 105"" BorderlineDashStyle=""Solid"" BorderWidth=""2"" Palette=""None"" 
PaletteCustomColors=""97,97,97; 209,98,96; 168,203,104; 142,116,178; 93,186,215; 255,155,83; 148,172,215; 217,148,147; 189,213,151; 173,158,196; 145,201,221; 255,180,138"" >
  <ChartAreas>
      <ChartArea Name=""Default"" _Template_=""All"" BackColor=""64, 165, 191, 228"" BackGradientStyle=""TopBottom"" BackSecondaryColor=""White"" BorderColor=""64, 64, 64, 64"" BorderDashStyle=""Solid"" ShadowColor=""Transparent"" /> 
  </ChartAreas>
  <Legends>
      <Legend _Template_=""All"" BackColor=""Transparent"" Font=""Trebuchet MS, 8.25pt, style=Bold"" IsTextAutoFit=""False"" /> 
  </Legends>
  <BorderSkin SkinStyle=""Emboss"" /> 
</Chart>";

Ответ 5

вы можете попробовать это. Его работа для меня

chart.Series [0].Color = System.Drawing.Color.FromArgb(31, 167, 215);