In a previous post I explained how to show percentages on a pie chart, that post included details of how to export a chart, edit the XML and import back into CRM.

In this post I will continue that theme by listing some common changes you might think about making to the funnel chart.

The OOB default sales pipeline chart looks like the one below. I personally quite like it! But you might feel the need to change the colours, move the labels, make it 3D or reformat the labels.

Below is an extract of the default XML for a funnel chart ….

<presentationdescription>
<Chart Palette="None" PaletteCustomColors="91,151,213; 237,125,49; 160,116,166; 255,192,0; 68,114,196; 112,173,71; 37,94,145; 158,72,14; 117,55,125; 153,115,0; 38,68,120; 67,104,43; 124,175,221; 241,151,90; 186,144,192; 255,205,51; 105,142,208; 140,193,104; 50,125,194; 210,96,18; 150,83,159; 204,154,0; 51,90,161; 90,138,57;">
<Series>
<Series ShadowOffset="0" IsValueShownAsLabel="true" Font="{0}, 9.5px" LabelForeColor="59, 59, 59" ChartType="Funnel" CustomProperties="FunnelLabelStyle=Outside, FunnelNeckHeight=0, FunnelPointGap=1, FunnelNeckWidth=5">
<SmartLabelStyle Enabled="True" />
</Series>
</Series>
<ChartAreas>
<ChartArea>
<Area3DStyle Enable3D="false" />
</ChartArea>
</ChartAreas>
<Legends>
<Legend Alignment="Center" LegendStyle="Table" Docking="right" Font="{0}, 11px" ShadowColor="0, 0, 0, 0" ForeColor="59, 59, 59" />
</Legends>
<Titles>
<Title Alignment="TopLeft" DockingOffset="-3" Font="Segeo UI, 13px" ForeColor="0, 0, 0"></Title>
</Titles>
</Chart>
</presentationdescription>
<isdefault>false</isdefault>
</visualization>

I will now list some of the common changes you might want to make to this xml.

In the “<Series>”, I have changes the size and colour of the labels

<Series>

<Series ShadowOffset="0" IsValueShownAsLabel="true" Font="{0}, 15px" LabelForeColor="204, 0, 0" ChartType="Funnel" CustomProperties="FunnelLabelStyle=Outside, FunnelNeckHeight=0, FunnelPointGap=1, FunnelNeckWidth=5">

<SmartLabelStyle Enabled="True" />

</Series>

Then in “<Chart Area>” I have changed the “<Area3DStyle Enable3D>” to be true

<ChartArea>
<Area3DStyle Enable3D="true" />
</ChartArea>

And in “<Legends>” I have increased the size of the legend text.

</ChartAreas>
<Legends>
<Legend Alignment="Center" LegendStyle="Table" Docking="right" Font="{0}, 20px" ShadowColor="0, 0, 0, 0" ForeColor="59, 59, 59" />
</Legends>

This made my funnel chart look like this ….

Here you can see that I have added “LabelFormat” to the series. And also changed the FunnelLabelStyle to Inside.

<Series>
<Series ShadowOffset="0" IsValueShownAsLabel="true" Font="{0}, 9.5px" LabelFormat="#,#,.##K" LabelForeColor="59, 59, 59" ChartType="Funnel" CustomProperties="FunnelLabelStyle=Inside, FunnelNeckHeight=0, FunnelPointGap=1, FunnelNeckWidth=5">
<SmartLabelStyle Enabled="True" />
</Series>

This results in a chart that looks like this ….

Some other options for the label style include;

LabelFormat="#,0"           // No scaling, No decimals, leading zero
LabelFormat="#,0,K"         // Thousands,  No decimals, leading zero
LabelFormat="#,0,,M"        // Millions,   No decimals, leading zero
LabelFormat="#,0,,,B"       // Billions,   No decimals, leading zero
LabelFormat="#,0.00"        // No scaling, Two decimals, leading zero
LabelFormat="#,0,.00K"      // Thousands,  Two decimals, leading zero
LabelFormat="#,0,,.00M"     // Millions,   Two decimals, leading zero
LabelFormat="#,0,,,.00B"    // Billions,   Two decimals, leading zero
LabelFormat="#,#.##"        // No scaling, Up to two decimals, no leading zero
LabelFormat="#,#,.##K"      // Thousands,  Up to two decimals, no leading zero
LabelFormat="#,#,,.##M"     // Millions,   Up to two decimals, no leading zero
LabelFormat="#,#,,,.##B"    // Billions,   Up to two decimals, no leading zero

You can change the pallet of colours by change the Chart Palette from “None” to any one of the following;

Bright 
Grayscale 
Excel 
Light 
Pastel 
EarthTones 
SemiTransparent 
Berry 
Chocolate 
Fire 
SeaGreen 
BrightPastel (the default if set to "None") 

A couple of examples follow.

<Chart Palette="Chocolate" PaletteCustomColors="91,151,213; 237,125,49; 160,116,166; 255,192,0; 68,114,196; 112,173,71; 37,94,145; 158,72,14; 117,55,125; 153,115,0; 38,68,120; 67,104,43; 124,175,221; 241,151,90; 186,144,192; 255,205,51; 105,142,208; 140,193,104; 50,125,194; 210,96,18; 150,83,159; 204,154,0; 51,90,161; 90,138,57;">

GreyScale

Chocolate