Revolutionize Your Reports and Page Layouts with SVG: an innovative field format

If you add a long text field to a report, you may end up with something undesirable like the image below:  a field of plain text squeezed and stripped of any formatting.

The “normal” way of fixing that would be to create a plain text field and use a workflow to copy the first 255 characters of the long text field to it – that is, truncating the long text field.

This article shows another way of overcoming that limitation and making long text fields display with a fixed size and word wrap and in color without truncation.

In the previous article it was shown how to display formatted text using a VisualForce page that accepted parameters and converted text to a SVG image.
Now that idea will be expanded:   create a page that will accept any field from any object and generate an image after applying word wrap and color to its text value. The result is below:

Much nicer!

Here is how it was done:  an IMAGE formula field (below) that sends parameters to a VisualForce page which returns a SVG image.

IMAGE( ‘/apex/FieldToImage?wrap=60&color=’
+ IF( CONTAINS( ‘Energy|Construction|Transportation|Shipping|Utilities|Manufacturing|Agriculture’, TEXT( Industry ) ), ‘red’, ‘green’ )
+ ‘&object=Account&fieldName=description&id=’ + Id, ‘Color Description’ )

Please notice the following parameters passed to the FieldToImage VisualForce page:

1. wrap=60 – this limits each line to 60 characters
2. color= red or green, depending on the Account Industry – self-explanatory
3. object=Account – this tells the page controller to retrieve data from the Account
4. fieldName=description – this tells the page controller to retrieve data from the Account.Description field
5. id= the Account ID – self-explanatory

Instead of passing the text directly to the page, we passed the names of the object and field because formulas cannot reference long text fields directly (by the way, this idea needs more upvotes).

The code that implements the page and controller is here (GitHub links):

1. FieldToImageController.cls
2. FieldToImage.page

The Apex controller uses the parameters “object”, “fieldName” and “id” to create a dynamic SOQL query. It then fetches the text from the object and substitutes a couple of special characters in order to not break the SVG syntax.

// fetch the field and convert to text
List<SObject> objList = Database.query( ‘SELECT ID, ‘ + fieldName
+ ‘ FROM ‘ + objectName + ‘ WHERE ID = \” + theID + ‘\’ LIMIT 1′ );
if( objList.size() <= 0 ) {
return;
}
String rawText = String.valueOf( objList[ 0 ].get( fieldName ) );
if( rawText == null ) {
return;
}
rawText = rawText.replace( ‘<‘, ‘&lt;’ ).replace( ‘&’, ‘&amp;’ );

This idea can be expanded to make the VisualForce page return and display long text from related records or combined with parent records.
This is something that is not possible to do with just a formula since long text fields cannot be referenced in formulas and there are limited ways of accessing children records in the context of a page layout or report.

The next article will show a way to create dynamic hyperlink buttons – like the ones below – to display on page layouts and reports: