Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Maybe you found the answer a long time ago but given the fact that I found very little on this topic when searching for a way to colorize the bars of a chart I thought it might be useful to post the solution here when it opened up to me.</p> <p>It seems that the implementation of <em>System.Web.Helpers.Chart</em> is closely related to <em>System.Web.UI.DataVisualization.Charting.Chart</em>. Given this, I managed to find some clues as to how I could configure the "theme" XML properties:</p> <pre><code>public const String CHARTS_THEME = @"&lt;Chart BackColor=""#EFEFEF"" BackGradientStyle=""TopBottom"" BorderColor=""#A0A0A0"" BorderWidth=""1"" Palette=""None"" PaletteCustomColors=""#ffcc00"" &gt; &lt;ChartAreas&gt; &lt;ChartArea Name=""Default"" _Template_=""All"" BackColor=""Transparent"" BackSecondaryColor=""White"" BorderWidth=""1"" BorderColor=""#A0A0A0"" BorderDashStyle=""Solid"" &gt; &lt;AxisY&gt; &lt;MajorGrid Interval=""Auto"" LineColor=""64, 64, 64, 64"" /&gt; &lt;LabelStyle Font=""Verdana, 10pt"" /&gt; &lt;/AxisY&gt; &lt;AxisX LineColor=""#000000""&gt; &lt;MajorGrid Interval=""Auto"" LineColor=""64, 64, 64, 64"" /&gt; &lt;LabelStyle Font=""Verdana, 10pt"" /&gt; &lt;/AxisX&gt; &lt;/ChartArea&gt; &lt;/ChartAreas&gt; &lt;Legends&gt; &lt;Legend _Template_=""All"" BackColor=""Transparent"" Docking=""Bottom"" Font=""Verdana, 10pt, style=Plain"" LegendStyle=""Row""&gt; &lt;/Legend&gt; &lt;/Legends&gt; &lt;/Chart&gt;"; </code></pre> <p>Key to this point is to define your own <strong><em>PaletteCustomColors</em></strong> (I have only one color). To make this work, the <strong><em>Palette</em></strong> property must be set to <em>None</em>.</p> <p>Finally, just use your theme when creating an instance of your chart:</p> <pre><code>Chart chart = new Chart(width: 600, height: 200, theme:CHARTS_THEME); </code></pre> <p>Also check out the msdn documentation of <em>System.Web.UI.DataVisualization.Charting.Chart</em> to discover other ways to style your chart:</p> <p><a href="http://msdn.microsoft.com/en-us/library/dd467201.aspx" rel="nofollow">http://msdn.microsoft.com/en-us/library/dd467201.aspx</a></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload