Existing RadChart Skins

Posted by Community Admin on 05-Aug-2018 13:52

Existing RadChart Skins

All Replies

Posted by Community Admin on 27-Jul-2011 00:00

Hey,

I wanted to create a own skin for a RadChart, every tutorial tells me I should start with an existing telerik skin for this control.
But my problem is I can't find any existing skin for the radcharts.
For other controls I found files like:
treeview.black.css

Isn't there any file like that for the charts?

Posted by Community Admin on 01-Aug-2011 00:00

Hi Thomas Luck,

There are some differences between RadChart and most of the other controls when it comes to skinning. Since RadChart is just an image which is generated on the server, there is no CSS, but every skin is a set of predefined appearance properties, which are applied to the chart.

However I suggest you to use the following approach
1. modify some of the existing skin's properties and
2. apply the generated .xml file using the ApplyTo method as shown here.

RadChart1.Appearance.FillStyle.MainColor = System.Drawing.Color.Red; 
 
ChartSkin myCustomSkin = new ChartSkin(); 
myCustomSkin.CreateFromChart(RadChart1.Chart, "CustomSkin"); 
myCustomSkin.XmlSource.Save(Server.MapPath("~/MyCustomSkin.xml")); 
 
ChartSkin myCustomSkin1 = new ChartSkin("CustomSkin"); 
myCustomSkin1.XmlSource.Load(Server.MapPath("~/MyCustomSkin.xml")); 
myCustomSkin1.ApplyTo(RadChart2.Chart);
I hope this helps. Best wishes,
Sia
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Posted by Community Admin on 02-Aug-2011 00:00

Ok, I took one of you xml's and modified it.
It works all fine, excluding chaning the color of bars,lines,etc.
I changed the MainColor of all Series to red, after that wasn't working I also changed the Gradients to red, but nothing happend.
The series do still have the color of the default skin.

<ChartSeries>
      <Appearance>
        <Border Color="214, 214, 214" />
        <TextAppearance>
          <TextProperties Color="140, 140, 140" />
        </TextAppearance>
        <FillStyle MainColor="Red" FillType="ComplexGradient">
          <FillSettings>
            <ComplexGradient>
              <GradientElement Color="Red" />
              <GradientElement Color="Red" Position="0.5" />
              <GradientElement Color="Red" Position="1" />
            </ComplexGradient>
          </FillSettings>
        </FillStyle>
        <LineSeriesAppearance Color="230, 234, 237" />
      </Appearance>
    </ChartSeries>

Why isn't that working?

Posted by Community Admin on 04-Aug-2011 00:00

Hi Thomas Luck,

Please try with the following settings:

<Appearance>
    <FillStyle MainColor="Red" FillType="Solid" />
</Appearance>

All the best,
Sia
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Posted by Community Admin on 05-Aug-2011 00:00

Hey Sia,

No, it has no affect, it seems that every custom skins is using the Default skin, but just vor the series.
The title, xaxis and yaxis I can change.
Even if I copy one of your skins into a new file and load it, the skin is not working.

Posted by Community Admin on 09-Aug-2011 00:00

Ok, I made it, the problem was that I assigned the Skin to earlie.
Now another question, the customskins are working for everything fine, except the pie chart.
If I make in the code, it works with assigning the item a color.
Can I add to the xml also an item tag into a serie or something like that?
Or do I have to change the pie color in the code?

Posted by Community Admin on 10-Aug-2011 00:00

Hi Thomas Luck,

In order to change the color of a pie slice, you need to set its appearance /not the chart series's one/:

<telerik:ChartSeries Type="Pie">
    <Items>
        <telerik:ChartSeriesItem YValue="10" >
            <Appearance>
                <FillStyle MainColor="Red" FillType="Solid" />
            </Appearance>
        </telerik:ChartSeriesItem>
        <telerik:ChartSeriesItem YValue="30" />
        <telerik:ChartSeriesItem YValue="10" />
    </Items>
</telerik:ChartSeries>

Regards,
Sia
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

This thread is closed