Rendering Functions

In the case that one or more of these information is not explicitly available in the data, you can use the areaFunction, colorFunction, labelFunction and tooltipFunction properties to indicate to TreeMap the function it has to use to generate the corresponding information.

The following example shows how to use these properties:

<mx:Application xmlns:mx="" layout="vertical" xmlns:treemap="fr.kapit.components.treemap.*">
			import mx.collections.ArrayCollection;
			[Bindable]private var myDataProvider:ArrayCollection = new ArrayCollection([ 
	    		{itemLabel:"Item 1", itemArea:500, itemTooltip:"Tooltip 1"},  
	    		{itemLabel:"Item 2", itemArea:400, itemTooltip:"Tooltip 2"},  
	    		{itemLabel:"Item 3", itemArea:100, itemTooltip:"Tooltip 3"}, 

			private function myLabelFunction(item:Object, info:Object):String 
			    var label:String = "This is : "+item["itemLabel"]; 
			    return label; 
			private function myAreaFunction(item:Object):Number 
			    var area:Number = 100/item["itemArea"]; 
			    return area; 
			private function myColorFunction(item:Object):Number 
			    var color:Number = 100/item["itemArea"]; 
			    return color; 
			private function myTooltipFunction(item:Object, info:Object):String 
			    var tooltip:String = "Name : "+item["itemLabel"]+"\nArea : "+item["itemArea"]+"\nColor : "+item["itemColor"]; 
			    return tooltip; 
	<treemap:TreeMap id="myTreeMap"
		labelField="itemLabel" labelFunction="myLabelFunction"
		areaField="itemArea" areaFunction="myAreaFunction" 
		colorField="itemColor" colorFunction="myColorFunction"
		toolTipField="itemTooltip" toolTipFunction="myTooltipFunction"
		width="100%" height="80%"/>
	<treemap:TreeMapLegend treeMap="{myTreeMap}" width="100%" height="20%" />