Hi,

I am trying to create multiple charts on a VF page by including the apex:chart component inside an apex:repeat or apex:datatable component. I have created a wrapper class that includes field elements as well as chart data. I expected that when the page is renderd, the structure would be as follows

<tr>

<td>Field</td>

<td><span><div>chart1</div></span></td>

</tr>

<tr>

<td>Field</td>

<td><span>chart2</span></td>

</tr>

however, when the page renders, all charts included inside the span of the first row. eg..

<tr>

<td>Field</td>

<td><span><div>chart1</div><div>chart2</div></span></td>

</tr>

<tr>

<td>Field</td>

<td><span></span></td>

</tr>

I am not sure if I am doing something wrong here or if this is a bug. My VF code is as follows..

<apex:dataTable var="f" value="{!achievements}">
<apex:column >
<apex:outputText value="{!f.oInstance.Account__r.Name}"/>
</apex:column>
<apex:column >
<apex:chart height="125" width="285" animate="true" data="{!f.ChartData}">
<apex:axis type="Gauge" position="gauge" title="{!f.ChartData[0].data1}%" minimum="0" maximum="150" steps="5"/>
<apex:gaugeSeries dataField="data1" labelField="label" needle="false" donut="65" colorSet="#78c953,#ddd"/>
</apex:chart>
</apex:column>
</apex:dataTable>

I also tried to solve this issue by trying to force the chart to render inside a specific component using the renderto attribute. However, this required use of a variable to generate dynamic ids for the components and as of now this doesn't seem to be supported. The error message asked me to use a literal value for the id attribute.

Please help!!!

Thanks,

Alok Agrawal